仓酷云

标题: 带来一篇CSS进修教程:CSS代码优化和CSS重用优化 [打印本页]

作者: 柔情似水 时间: 2015-1-15 22:57
标题: 带来一篇CSS进修教程:CSS代码优化和CSS重用优化
DIV本身就是容器性质的,你不但可以内嵌table还可以内嵌文本和其它的HTML代码CSS是CascadingstyleSheets的简称，中文译作“层叠样式表单”。
破洛洛文章简介：CSS进修教程:CSS代码优化和CSS重用优化.
为人人先容复杂的CSS优化。
触及优化内容：
1、CSS代码优化
2、CSS重用优化

1、CSS代码优化中央：
1、border(CSS边框)简写：
border-top:1pxsolid#000;border-bottom:1pxsolid#000;border-left:1pxsolid#000;border-right:1pxsolid#000;
能够简写为：border:1pxsolid#000;
2、padding（CSSpadding）简写：
padding-top:1px;padding-right:2px;padding-bottom:3px;padding-left:4px;
可简写为：padding:1px2px3px4px;
padding-top:1px;padding-right:1px;padding-bottom:1px;padding-left:1px;
可简写为：padding:1px;
3、margin简写
margin-top:1px;margin-right:2px;margin-bottom:3px;margin-left:4px;
可简写为：margin:1px2px3px4px;
margin-top:1px;margin-right:1px;margin-bottom:1px;margin-left:1px;
可简写为：margin:1px;
4、background简写
background-color:#000;能够简写为background:#000;
background-image:url(图片地点)
可简写为：background:url(图片地点)
5、font简写
font-size:12px;line-height:12px;font-family:Arial,Helvetica,sans-serif;
可简写为：font:12px/12pxArial,Helvetica,sans-serif;

2、CSS重用优化
这里次要先容是CSS代码的共用属性提取来到达勤俭代码、保护便利，CSS实比方下：
.poluoluocom_a{width:100px;height:20px;text-align:left;float:left;font-size:24px;}
.poluoluocom_b{width:100px;height:20px;text-align:right;float:left;font-size:24px;}
他们都有不异高度、宽度、浮动、笔墨巨细，而只要内容居左居右分歧(你大概必要懂得CSS居中)，我们就能够提取他们不异属性
优化后:
.poluoluocom_a,.poluoluocom_b{width:100px;height:20px;text-align:left;float:left;font-size:24px;}
.poluoluocom_b{text-align:right;}

</p>
表现和内容相分离。将设计部分剥离出来放在一个独立样式文件中，你可以减少未来网页无效的可能。

作者: 因胸联盟 时间: 2015-1-17 19:55
布局表格、绘制层、制作CSS样式表等，这些内容迷糊了我的视线，真是没想到制作一个精巧别致的网页是如此的困难，可是心有不甘。

作者: 精灵巫婆 时间: 2015-1-26 22:20
技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。

作者: 第二个灵魂 时间: 2015-2-5 04:42
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH，专业网页图像设计软件FIREWORKS，并称为“网页三剑客”。

作者: 简单生活 时间: 2015-2-11 05:52
Dreamweaver在所见即所得添加链接，也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈，用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。

作者: 只想知道 时间: 2015-3-1 23:38
Adobe Dreamweaver CS5 软件使设计人员和开发人员能充满自信地构建基于标准的网站。由于同新的 Adobe CS Live 在线服务 Adobe BrowserLab 集成。

作者: 爱飞 时间: 2015-3-11 03:14
还是在Dreamweaver所见即所得添加链接是，可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。

作者: 海妖 时间: 2015-3-17 21:10
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。

作者: 兰色精灵 时间: 2015-3-25 06:27
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。

欢迎光临仓酷云 (http://ckuyun.com/)