1.类选择器的使用
#box .content{}
.content .item{}
后代选择器：以下面的这个为例子，那么类选择器item，只有在使用了.content类选择器的标签内才有效；
若是没有使用content，直接使用了item，是无效的。这样可以避免出现当使用了相同的标签造成的样式全部相同了；
2.水平居中 text-align为center； 已知宽的 margin 0(可以是具体数据) auto
3.垂直居中； 设置top值为 外部高度减去内部高度的一半
下面是一些例子
示例1：文字居中，图片与文字底部对齐
示例1：主要样式设置
第二个示例：
示例2：左侧是背景图，右侧是一个div
大概代码如下：以前一直都傻傻的认为，父级多高，子元素如果不设置宽度和高度那么默认就是和父级等高；
其实不设置的话那么默认都是内容撑开宽度；
示例2：大致代码
I AM A GREEN HAND!
COME ON!
示例3：
示例3：每一个都是相同的块，边框都是1px
为了不使得上下两个块的边框组成2px；可以设置margin-bottom为-1px;
具体代码如下
示例3代码
同样的思想的还有下面这种样式
示例4
示例：4，最后一个没有|
我们可以设置border-right的颜色和宽度；最后一个不给设置border-right：none；
示例4
示例：4
大致代码如下：
大致结构如图
类选择器大致如下图
网友评论