Web标准发展建议与好的实例之CSS之浏览器的支持

2016-01-29 12:39 2 1 收藏

Web标准发展建议与好的实例之CSS之浏览器的支持,本系列Web标准发展建议与好的实例系列文章将向朋友们介绍Web标准是如何使一个开发者建设网站更加的节省时间与金钱,如何使浏览者获得更好的浏览经历,以及他们的原因。同时,本文还涉及到一些方法,准则和好的实例用来帮助您建设一个对尽可能多的人都充满亲和力的高质量的网站。

【 tulaoshi.com - Html 】

在学习中遇到问题可以到 论坛 发贴交流!

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/html/)

CSS

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/html/)

CSS过去经常被用来定义字体的属性,而现在可以用它来控制整个文档的布局。然而,为了有效的用CSS来控制布局,需要做一些不同的处理,这种不同是跟用表格布局相对比的。

为了CSS可以高效的控制布局,结构化、语义化的XHTML是必不可少的。

浏览器的支持

正如前面所提到的,在过去几年,浏览器对CSS的支持程度已经改进了很多。不幸的是,浏览器的开发商好象对实施开放的标准并不感兴趣,所以不同浏览器对CSS的支持程度也大相径庭。就算是支持程度最好的浏览器,在软件中仍然有一些bug,使得浏览器以错误的方式运行。

现在(2004), 对CSS支持比较好的浏览器有Mozilla (还有以Gecko为内核的: Firefox, Camino,), Opera和Safari (还有以 WebCore为内核的: OmniWeb 4.5 and later)。 Internet Explorer 6/Win并没有如此好的CSS支持程度,但是它将让你为其做出大量的基础工作。Internet Explorer 5/Mac对CSS 1的支持很出色, 但是却不支持CSS 2。 IE 5.* for Windows的支持性也很好, 但是仍然有一些问题值得你去注意。早期版本的IE以及Netscape 6以前的版本就没有必要提及了。

因为现在大多数人都使用IE/WIN,所以你将不得不让它成为特殊分子。这并不是说,你不能或者不应该使用有更好支持CSS能力的浏览器来提高他们的设计能力。

现在在用的浏览器中,并不是所有的浏览器都有很好的CSS支持能力,使其能够具有解释用CSS布局的优秀图形化站点的能力。幸运的是,对于大多数网站,只有很小比例的访问者还在使用不能解释CSS的老浏览器。

值得注意的是,这些人并不会被排斥在外的。在90年代,浏览器检验脚本是一个很流行的方法,它告诉那些使用错误浏览器的使用者一个新的网址,那个网址告诉他们去升级浏览器,好重新连接到那个网站。

现在,你可以以一种更好的办法应付不被支持的浏览器。使用逻辑化、语义化的一个最大的好处就是它使文档在没有CSS时,仍然可以使用和访问。表现(就是文档看上去的样子)在一个支持性好的浏览器中也将呈现的不一样,但是它的内容将永远不变,大多数情况,对于访问网站的人来说,内容实际上比表现的方式更加重要。这就是为什么给那些支持性不好的浏览器发送一个没有样式的页面,要比把他们排斥在外要好的原因。

有好几种方式去解决这个问题:一种最常见的方法是使用 @import来链接相应的的CSS文件。Netscape 4和老的浏览器不支持@import所以将不会导入CSS文件。还有许多方法来向浏览器隐藏CSS。大多数隐藏CSS的方法是利用了浏览器对CSS解释时的漏洞。这意味着总会存在浏览器通过升级弥补漏洞的危险。所以越少的依赖CSS hacks(CSS漏洞)越好。

很明显的,你可以使用服务器端技术去做一个浏览器检测,然后针对不同的浏览器,发送不同的CSS文件。如果你这么做了,你必须要确保检测脚本是通用的,以避免因为浏览器的升级或者新的浏览器发布导致发送错误的CSS文件。

相关文章: 

Tricking Browsers and Hiding Styles
Eric Meyer讲述了针对特定的浏览器隐藏CSS的四种方法。

CSS Filters and Hacks
隐藏CSS技术大荟萃。(链接已更新)

Progressive enhancement using CSS
介绍用不同方法来加强使用现今浏览器的人们的体验。

来源:https://www.tulaoshi.com/n/20160129/1487016.html

延伸阅读
标签: Web开发
由于是源自笔记,对每个条目我只会列出称呼和语法特征,暂时没时间写详细的解释和可执行的示例,但是会给出相关的文档地址,除了列出已经支持该特性的浏览器,也会为不支持的浏览器提供替代/过渡的实现。好罢这篇本来是我私下做的笔记,我特别喜欢在Evernote上做备忘的笔记,虽然上次看到漏屋老师的文章里说我现在的年龄才刚刚进入记忆力的巅峰...
标签: Web开发
我很久以前就开始计划着整理一下CSS选择器的浏览器支持,因为CSS3增加了很多非常有用的选择器。之前我也写过一篇《使用CSS选择器创建个性化链接样式 》,作为对CSS选择器的初步研究。 kimblim网站整理了一份很全面的CSS选择器支持情况,我将其翻译过来并进行进一步的整理,将其尽可能的简化。同时结合evotech网站整理的CSS选择器支持列表,以...
标签: Web开发
我很久以前就开始计划着整理一下CSS选择器的浏览器支持,因为CSS3增加了很多非常有用的选择器。CSS属性选择器制作个性化链接样式作为对CSS选择器的初步研究。 kimblim网站整理了一份很全面的CSS选择器支持情况,我将其翻译过来并进行进一步的整理,将其尽可能的简化。同时结合evotech网站整理的CSS选择器支持列表,以及我自己平时总结的一...
标签: Web开发
虽说在CSS参考手册中注明了cursor兼容性:IE4.0+ NS6.0+ 继承性:有。但还是有些属性值在FF环境中不支持. FF及IE6+支持的鼠标样式有 all-scroll  : IE6.0 有上下左右四个箭头,中间有一个圆点的光标。用于标示页面可以向上下左右任何方向滚动。 col-resize  : IE6.0 有左右两个箭头,中间由竖线分隔开的光...
标签: Web开发
浏览器发展/CSS布局/怎样合理运用? IE7正在逼近...为什么使用逼近这个字眼呢?因为我为曾经使用CSS布局的网站感到担忧. CSS Hack 曾经为了让多个浏览器达到同样的效果,使用的又是CSS布局,我使用了CSS Hack.但随着IE7的到来,一些作用的失效,布局又出现了严重的问题.难道我们所提倡的CSS布局就是这样的让人不安么? 出现问题自然会让人想到...

经验教程

200

收藏

25
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部