网络编程 | 站长之家 | 网页制作 | 图形图象 | 操作系统 | 冲浪宝典 | 软件教学 | 网络办公 | 邮件系统 | 网络安全 | 认证考试 | 系统进程
Firefox | IE | Maxthon | 迅雷 | 电驴 | BitComet | FlashGet | QQ | QQ空间 | Vista | 输入法 | Ghost | Word | Excel | wps | Powerpoint
asp | .net | php | jsp | Sql | c# | Ajax | xml | Dreamweaver | FrontPages | Javascript | css | photoshop | fireworks | Flash | Cad | Discuz!
当前位置 > 网站建设学院 > 网页制作 > CSS
网页制作:Dreamweaver教程,FrontPages教程,Javascript教程,HTML教程,CSS教程,心得技巧,DHTML教程,网页特效,Discuz!论坛
本月文章推荐
.经常用到的css重置代码.
.CSS让表格的溢出内容隐藏起来.
.CSS技巧补遗二十四则.
.对css滑动门技术的一些总结和归纳.
.CSS创建圆角框.
.CSS+DIV表格背景透明,内容不透明.
.css(div+span)padding的使用.
.用CSS设计高体验的表单显示效果示.
.css 背景图片的定位问题.
.css的链接美化.
.DIV+CSS常见错误汇总.
.对display:inline;与float:left;.
.IE对网页中引入CSS样式表的限制.
.一个针对IE7的CSS Hack.
.导航上用CSS标志当前页效果的实现.
.利用相对定位及偏移量做精美输入.
.门户网站与大型网站的CSS架构与组.
.超强,用CSS构建iframe效果.
.哀悼逝者 快速将你的网站变成灰色.
.Javascript+css 实现网页换肤功能.

CSS: 关于如何选择同一容器内部分标签的想法

发表日期:2008-9-23


首先来看一段代码:
<br />
#wrap p {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />
#wrap span {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />
#wrap ul {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />
#wrap font {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />
#wrap .swd {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />

很容易看出, 这段代码中我们对多个不同的标签进行了相同的属性定义. 所以在一般情况下, 我们会这样来整合代码:


<br />
#wrap p, #wrap span, #wrap ul, #wrap font, #wrap .swd {<br />
    font-size: 14px;<br />
    color: red;<br />
}

在这段代码中, 我们将放置在 #wrap 容器里的一些标签同时进行了定义 [包括字体大小和颜色] . 与前面的相比, 节省了很多代码.

但事实上, 我们还是没有做到最大限度的压缩代码. 因为在上面的这段代码中, 我们所定义的对象都是被放置在 #wrap 容器中的. 所以, 我们能不能用某种办法来声明, 我们所定义的对象对是处于 #wrap 内呢?

来看看这个, 锐风的想象版1:


<br />
 #wrap {<br />
    p, span, ul, font, .swd {<br />
        font-size: 14px;<br />
        color: red;<br />
    }<br />
}<br />

这个版本应该还是很容易理解的.

再来看看锐风的想象版2:


<br />
#wrap(p, span, ul, font, .swd){<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />

这个和前面的相比, 对于普通的读者来说可能稍稍有些难理解. 但是学过 PHP 的朋友都应该很熟悉吧? 是的, 这个完全参考了 PHP 的语法. 所以从理论上讲, 这个版本对脚本解释器应该会更友好一些.

上面我提到的这两种办法, 可能并不是完全可行. 但在一些时候, 或许我们确实应该多一点挑剔. 你说呢?

上一篇:火狐/IE浏览器flash透明,css强制不换行,溢出隐藏 人气:1487
下一篇:CSS Alpha透明代码相关知识学习 人气:1117
浏览全部CSS的内容 Dreamweaver插件下载 网页广告代码 祝你圣诞节快乐 2009年新年快乐