|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
使用Div+CSS所费功夫与收入不成正比,利用table可以大大减少工作量。而上市公司的期望目标不同对Div+css的认同和投入要大一些。
[media=wmv,600,450][/media]
点击下载视频教程(感激动力软件园供应下载空间)
利用缩写能够匡助削减你CSS文件的巨细,加倍简单浏览。css缩写的次要划定规矩以下:
色彩
16进制的色采值,假如每两位的值不异,能够缩写一半,比方:#000000能够缩写为#000;#336699能够缩写为#369;#f2f2f2是不成以缩写的
盒模子的边框
border-width:1px;
border-style:solid;
border-color:#000;
能够缩写为一句:
border:1pxsolid#000;
语法是border:widthstylecolor;
盒模子的界限和添补
margin-top:1px;margin-right:2px;margin-bottom:3px;margin-left:4px;
margin:1px2px3px4px;
注重:这里的按次是顺时针,分离为:上右下左
margin:1px2px;
margin:0;
注重:CSS中值为0时能够不带单元,别的时分都必需带单元
背景
background-color:#f00;
background-image:url(background.gif);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:00;
能够缩写为一句:
background:#f00url(background.gif)no-repeatfixed00;
字体
font-style:italic;
font-variant:small-caps;
font-weight:bold;
font-size:1em;
line-height:140%;
font-family:"LucidaGrande",sans-serif;
能够缩写为一句:
font:italicsmall-capsbold1em/140%"LucidaGrande",sans-serif;
注重,假如你缩写字体界说,最少要界说font-size和font-family两个值。
列表
list-style-type:square;
list-style-position:inside;
list-style-image:url(image.gif);
能够缩写为一句:
list-style:squareinsideurl(image.gif);
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>6、CSS缩写[视频]</title><styletype="text/css"><!--.aa{color:#FF0000;margin:1px2px3px4px;padding:2px;border:2pxsolid#666666;height:300px;width:500px;background:#FFFF66url(bg.gif)repeat-xlefttop;font:14pxArial;}.aaul{list-style:none;}--></style></head><body><divclass="aa"><ul><li>尺度之路</li></ul></div></body></html>
尺度之路www.ckuyun.com提醒:能够先修正部分代码后再运转
我这个时候还没意识到div在一些新人眼中产生的误导会比我想象的严重,直到第二个美工上班。 |
|