背景
设置背景图片大小 -moz-background-size:50px 50px;
不同位置剪切背景图片 -moz-background-clip:content-box;
border-box:边框内显示图片。
padding:内边距内显示图片。
content:内容内显示图片。
不同位置显示背景图片 -moz-background-origin:border-box;
border-box:从border区域开始显示背景。
padding:从padding区域开始显示背景。
content:从content区域开始显示背景。
伪类
在内容的前面插入内容 .test:before{ content:"您使用的浏览器支持content属性"; }
在内容的后面插入内容 .test:after{ content:"CC使用的浏览器支持content属性"; }
文本
文字阴影 text-shadow: 5px 5px 1px #AAA;
文字内容是否截断 text-overflow:clip|ellipsis; clip:
单词操作边界直接切断
ellipsis:单词操作边界使用省略号 设置内容是否换行 word-wrap:break-word;
文本换行 normal
连续内容边界内换行 break-word
基础盒模型
轮廓 outline-width:10px; 轮廓边框宽度
outline-style:solid; 轮廓边框风格
outline-color:red; 轮廓边框颜色
outline-offset:100px; 轮廓距离边框的距离
内容
文字列显示
-moz-column-count:3; 将内容分成几列
-moz-column-gap:20px; 列和列的间距
-moz-column-rule-style:solid; 列分隔线风格
-moz-column-rule-width:1px; 列分隔线宽度
-moz-column-rule-color:red; 列分隔线颜色
CSS3基础知
过渡
旋转角度 -moz-transform:rotate(180deg);
旋转基点设置 x y -moz-transform-origin:50px 50px;
水平垂直移动 -moz-transform:translate(12px,20px);
水平垂直缩放 -moz-transform:scale(0.3);
水平垂直扭曲 -moz-transform:skew(10deg,-30deg);