|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
所有的设计第一步就是构思,构思好了。
边框:(Borders)
border-color:把持边框色彩,而且有了更年夜的天真性,能够发生突变效果
border-image:把持边框图像
border-corner-image:把持边框边角的图像
border-radius:能发生相似圆角矩形的效果
背景(Backgrounds)
background-origin:决意了背景在盒模子中的初始地位,供应了3个值,border,padding和content
border:把持背景肇端于左上角的边框
padding:把持背景肇端于左上角的留白
content:把持背景肇端于左上角的内容
background-clip:决意边框是不是掩盖住背景(默许是不掩盖),供应了两个值,border和padding
border:会掩盖住背景
padding:不会掩盖背景
background-size:能够指定背景巨细,以象素或百分比显现。当指定为百分比时,巨细会由地点地区的宽度、高度,和background-origin的地位决意
multiplebackgrounds:多重背景图像,能够把分歧背景图像只放到一个块元素里。
笔墨效果:(Texteffects)
text-shadow:笔墨投影,多是由于MACOSX的Safari扫瞄器入手下手撑持投影才特地增添的。
text-overflow:当笔墨溢出时,用"..."提醒。包含ellipsis、clip、ellipsis-word、inherit,前两个CSS2就有了,今朝仍是部分撑持,但风趣的是IE6竟然也撑持。ellipsis-word能够省略失落最初一个单词,对中辞意义不年夜,inherit能够承继父级元素。
色彩:(Color)
HSLcolors:除撑持RGB眼色外,还撑持HSL(色相、饱和度、亮度)。之前一样平常都是作图的时分用HSL色谱,但如许一来会包含更多的色彩。H费用暗示,S和L用百分比暗示,好比hsl(0,100%,50%)
HSLAcolors:加了个不通明度(Apacity),用0到1之间的数来暗示,好比hsla(0,100%,50%,0.2)
opacity:间接把持不通明度,用0到1之间的数来暗示
RGBAcolors:和HSLAcolors相似,加了个不通明度
用户界面(User-interface)
resize:能够由用户本人调剂div的巨细,有horizontal(程度)vertical(垂直)大概both(同时),大概同时调剂。假如再加上max-width或min-width的话还能够避免损坏结构
选择器:(Selectors)
Attributeselectors:在属性中能够到场通配符,包含^,$,*
[att^=val]:暗示入手下手字符是val的att属性
[att$=val]:暗示停止字符是val的att属性
[att*=val]:暗示包括最少有一个val的att属性
别的模块:(Othermodules)
mediaqueries:感到叫媒体选择对照符合,能够为网页中分歧的工具设置分歧的扫瞄设备。好比能够为某一块分离设置屏幕扫瞄款式和手机扫瞄款式,之前则只能设置全部网页。
multi-columnlayout:多列结构,让笔墨以多列显现,包含column-width、column-count、column-gap三个值
column-width:指定每列宽度
column-count:指定列数
column-gap:指定每列之间的间距
column-rule-color:把持列间的色彩
column-rule-style:把持列间的款式
column-rule-width:把持列间的宽度
column-space-distribution:均匀分派列间距
大大缩减页面代码,提高页面浏览速度,缩减带宽成本; |
|