冷月葬花魂 发表于 2015-1-16 10:34:17

DIV教程之6、【视频】CSS缩写

使用Div+css所费功夫与收入不成正比,利用table可以大大减少工作量。而上市公司的期望目标不同对Div+css的认同和投入要大一些。

[*]
[*]

点击下载视频教程(感激动力软件园供应下载空间)
利用缩写能够匡助削减你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在一些新人眼中产生的误导会比我想象的严重,直到第二个美工上班。

不帅 发表于 2015-1-18 06:48:02

所见则所得网页编辑器的优点就是直观性,使用方便,容易上手.

小魔女 发表于 2015-1-24 15:39:58

使用所见即所得的接口,亦有HTML编辑的功能。它现在有Mac和Windows系统的版本。原本由Macromedia公司所开发。

透明 发表于 2015-2-2 06:06:36

Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。

乐观 发表于 2015-2-7 17:59:51

以上大概就是文字图片的一些链接方法,通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识,他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起,其功能强大,使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。

愤怒的大鸟 发表于 2015-2-22 22:16:26

我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中,我总结了四大定律:兴趣、恒心、虚心、时间。

分手快乐 发表于 2015-3-14 13:36:27

使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。

灵魂腐蚀 发表于 2015-3-21 09:51:11

使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。
页: [1]
查看完整版本: DIV教程之6、【视频】CSS缩写