不同的浏览器要求不同的样式声明,各浏览器及其各版本有不同程度的 CSS 执行的完整性。采用的是 Internet Explorer 的条件注释语法的思想,并把它内联到 CSS 声明之中。
条件 CSS 主要用于指出一个特别的 CSS 声明是不是应该用于一个特别的浏览器。当然你不希望经常这么做,但是当你需要针对一个浏览器的时候,它会非常有用。可以在U4EA支持列表里看到,大部分的浏览器都支持这种方式。
任意 CSS 声明或者块都可以添加条件声明前缀,这些前缀有3种基本类型:
- [if {!} browser]
- [if {!} browser version]
- [if {!} condition browser version]
从开始学习前端设计开始,就能看到不少网站把一些背景图片和 ICO 图标文件都整合成一个文件.刚开始还不能理解这是为什么,反而认为这样增加了设计人员的工作量.但通过一段时间的接触后,才懂得整合文件的好处.
其实在平时的电脑操作上我们都能遇到类似的情况,比如我们把几百张照片从D盘拷贝到E盘,可能需要十几分钟的时间.但如果这几百张照片事先压缩成一个文档,拷贝的速度就会快很多,而且时间也花了更少.
同样的道理,CSS Sprites 的目的就是通过整合图片,减少对服务器的请求数量,从而加快页面加载速度.(见下图)
有时候博客经常会提供一些资源供别人下载,但是通常程序中所有的下载链接都只用一个图标来表示.有了新CSS3的属性选择符这项新技术后就可以根据下载文件的不同类型显示不同的图标了.
这里要用到的是:
- E [att$=value]{…}
它的意思用以选取所有以value结尾的元素E.那么可以这样写:
- a[href$='.torrent'] {
- padding: 5px 20px 5px 0;
- background: transparent url(icons/icon_torrent.gif) no-repeat center right;
- }
- a[href$='.vcard'] {
- padding: 5px 20px 5px 0;
- background: transparent url(icons/icon_vcard.gif) no-repeat center right;
- }
- a[href$='.exe'] {
- padding: 5px 20px 5px 0;
- background: transparent url(icons/icon_exe.gif) no-repeat center right;
- }
- a[href$='.dmg'], a[href$='.app'] {
- padding: 5px 20px 5px 0;
- background: transparent url(icons/icon_dmg.gif) no-repeat center right;
- }
1.WEB标准不是某一个标准,而是一系列标准的集合.
2.网页主要由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior).
3.对应的标准也分三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3C DOM)、ECMAScript等.这些标准大部分由W3C起草和发布,也有一些是其他标准组织制订的标准,比如ECMA(European Computer Manufacturers Association)的ECMAScript标准.