容易遗忘点
逗号隔开选择器,可以共享后面写的规则 空格隔开选择器,代表满足这种家族关系才能用后面写的规则 如果空格改成>号,则要满足父子关系才能用后面写的规则
~大杂烩选后面所有指定兄弟元素 +只选后面一个指定兄弟元素
书写规范:布局->盒子->文本->装饰
外边距叠加只是垂直边距,水平边距不会叠加!可设两个独立 BEF 来消除叠加
行内元素 inline 内部只能容纳其他行内元素 无法定义长宽和上下 margin,但可定义左右 margin
行内块元素 inline-block 可定义长宽 默认此值的有 img 和 input 不默认此值的 span 和 a 改成这个,就可定义长宽 问题是多个并列会有间距,去除办法为父元素字体设为 0
文本 text 属性 -decoration 划线 -transform 大小写 -spacing 空格,分为 letter 字母空和 word 单词空 -indent 首行缩
对齐 text-align 水平对齐方式,对 block 无效,要换成 inline-block vertical-align 垂直对齐基准,对 block 无效,要换成 inline-block
浮动 浮动后会变成 block 块元素类型,可定义宽高和边距,后面元素会挤上来占有其原本位置,但会被盖在后面
z-index 只有设置了 position 属性才会被激活
雪碧图 background-image 引入大图 background-position 截取部分小图 CSS Sprite Generator 在线工具可上传小图生成大图 Sprite Cow 可自动生成大图中某小图的 css 代码
CSS3 到 IE9 才支持,在 7 和 8 中可以引入 ie-css3.htc 扩展,兼容情况可在 Can I Use 可查
border-radius: 30px; //圆角半径
text-indent:20px //首行缩进
letter-spacing:1px //字间距
vertical-align: middle; //图片垂直居中
z-index //重叠元素的堆叠顺序
transform: rotate(45deg); //旋转元素45度(菱形)