首頁 >web前端 >html教學 >CSs3_html/css_WEB-ITnose

CSs3_html/css_WEB-ITnose

WBOY
WBOY原創
2016-06-24 11:37:271222瀏覽

CSS3的三部曲:设置字体,设置宽度和高度及盒模型,设置链接。其中,字体包括字体组,字体大小,行高,颜色。第二部包括宽度和高度及margin,padding,(margin:0 auto是实现居中)。链接文本样式包括link.hover,visitied,active 4种状态。实现的部分包括,字体,整体背景,页面宽度,链接样式。

前缀:-webkit---chrome and safari;

 -moz---firefox;

-ms---IE;

-o---opera;

CSS3的新增样式:

1、border-radius:圆角效果{实心上半圆:高度Height是宽度width的一半,设置左右上角与高度一致;实心圆:高度Height和宽度width的一样,设置四个角为他们的一半;}从左上开始,顺时针旋转开始。

2、box-shadow:盒子阴影{X偏量,Y偏量,阴影模糊值,阴影扩展半径,阴影颜色,投影方式(inset为内投影,只能写在第一个或者最后一个)}当偏移量为负值时,表示在相反位置。

3、text-shadow:文本阴影与盒子阴影相似。

4、border-image:边框颜色:{:URL(),round表示平铺/repeat表示重复/stretch表示拉伸}

5、border-color:边框颜色:低,顶,左,右

6、透明度{两种表示方法 1、rgba(255,255,255,0.2)表示白色的不透明度为0.2,rgba(0,0,0,0.2)表示黑色的不透明度为0.2。 2、opacity:0.2}

7、渐变色彩:{包括线性和径向:linear-gradient 、radial-gradient}

8、text-overfiow{溢出时省略标记,代码如下:(text-over:ellipsis/表示省略;overflow:hidden;white-space:nowrap;)clip表示中断;

 而word-wrap:normal表示连续/break-word表示中断。

9、@font-face表示侵入服务器端的字体文件。

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn