stretchcolumns(毫无头绪的，CSS3知识清单帮你理清思路)

（页底留言开放，欢迎来吐槽）

先总结一篇简略版CSS3知识清单。

2、边框

圆角：border-radius: 5px 4px 3px 2px;  
阴影：box-shadow: X轴偏移量 Y轴偏移量
[阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式];
外阴影 ：box-shadow:4px 2px 6px #333333;
内阴影： box-shadow:4px 2px 6px #333333 inset;
多阴影： box-shadow:4px 2px 6px #f00, -4px -2px 6px #000, 0px 0px 12px 5px #33CC00 inset;
边界图片：border-image: 图片路径 像素顺时针 延伸方式（repeat重复
round平铺 stretch 拉伸） border-image:url(border.png) 30 30 round; -webkit-border-image:url(border.png) 30 30 round;  -o-border-image:url(border.png) 30 30 round; 

【例】background:url(logoindex.png) no-repeat left top/75% 50% , url(logoindex.png) no-repeat right bottom/50% 45%;

5、文本效果

阴影：text-shadow:X偏移 Y偏移 模糊程度 阴影颜色； text-shadow: 5px 5px 5px #FF0000;文本溢出：text-overflow:ellipsis; overflow:hidden; white-space:nowrap;

调用：font-family: 字体名称;

nerror="javascript:errorimg.call(this);">

9、过渡 （transition: 带前缀-webkit-）

10、动画 (-webikt-)

11、多列布局

多列布局 columns：(column-width) || (column-count); column-width: auto | (length); column-count：auto | (integer);列间距 column-gap: normal || (length)列表边框 column-rule:(column-rule-width)|(column-rule-style)|(column-rule-color)跨列设置 column-span: none | all 

nerror="javascript:errorimg.call(this);">

outline:2px solid red;outline-offset:15px;

14、自由缩放属性

resize：none | both | horizontal | vertical | inherit

干货！免费领取腾讯高级讲师网页设计教程

点击下方“阅读原文”结交更多有才华的设计师！

↓↓↓