用CSS3将你的设计带入下个高度[译]
作者:神采飞扬 来源:前端观察 发布时间:2009-06-22 13:03:00
级联样式表在13年前被引入,而且被广泛使用的CSS 2.1 标准在11年前被创建,显然我们现在已经与当年相差千里了。相当了不起的是期间网站开发有了多少进步——事实上,我们也无法想象。
为什么会这样呢,当提到CSS的时候,过去我们是如此的不情愿和害怕尝试?为什么我们还要使用讨厌的hack和依赖JavaScript的技术来写样式?为什么我们不能利用丰富的CSS3 特性和现代浏览器中可用的工具 并将我们的设计品质带到下一个等级?
是时候在我们的项目中引入CSS3 特性了,不用害怕逐渐在我们的样式表中加入css3特性和选择器会出问题。让我们的客户意识到CSS3的优势 (而且让旧浏览器更快的消失)是我们力所能及的事情——我们应该这样做,特别是在它能够让网站更加灵活并减少开发和维护成本的时候。
在本文中,我们将研究CSS3的优势,并看一下一些网页设计师是如何使用它们的。最后,我们将了解到从CSS3中我们能得到什么以及我们如何在我们的项目中使用它的新特性。
同时请参考我们之前的一篇相关文章:
使用浏览器专有属性
为了使用大部分CSS3特性,我们不得不与原来的属性一起使用生产商专有扩展。原因是直到现在,大部分浏览器只支持部分CSS3属性。而且不幸的是,一些属性甚至到最后都可能不被W3C推荐,所以通过指定浏览器专有属性,将他们与标准属性区分开来是很重要的(然后在他们是多余的的时候使用符合标准的样式将之覆盖)。
当然,这种方法的劣势是,将导致一个杂乱的样式表和网站在浏览器之间的表现不一致。毕竟,我们不想在我们的样式表中重拾私有浏览器hack的需求。Internet Explorer的臭名昭著的marquee、blink以及其它标签在大量样式表中被应用,并在20世纪九十年代成为一个传奇;它们依然让现存的很多网站(在其他浏览器中)表现不一致甚至难以阅读。而我们现在也不想将我们自己置于同样的境地,对吧?
然而,网站不需要在所有的浏览器中看起来必须严格的一致。有的时候在某个浏览器中使用私有属性来实现特定的效果是可行的。
最常见的私有属性是用于Webkit核心浏览器的(比如, Safari), 它们以-webkit-开始,以及Gecko核心的浏览器(比如, Firefox),以-moz-开始,还有Konqueror (-khtml-)、Opera (-o-) 以及Internet Explorer (-ms-)都有它们自己的属性扩展(目前只有IE8支持-ms-前缀)
作为专业的设计师,我们不得不注意:使用这些私有属性将让我们的样式表不能通过验证。所以目前将他们放到最终版的样式中是少见的。但是在某种情况下,比如试验或学习,我们至少可以考虑将他们和标准的CSS属性一起写到一个样式表中。
扩展阅读
猜你喜欢
- 参数让我们进一步看看CPU的数量是如何影响这些参数的。 参数fast_start_parallel_rollback Oracle并行机制中
- 锁定数据库的一个表 SELECT * FROM table WITH (HOLDLOCK) 注意: 锁定数据库的一个表的区别 SELECT
- WEB标准化之前的互联网是TABLE布局的天下,但随着互联网的高速发展,TABLE布局已经不能满足千变万化的页面所来来的更新压力和服务器压力
- 如果视图定义包括条件(譬如 WHERE 子句)并且其意图是确保任何引用该视图的 INSERT 或 UPDATE 语句都应用 WHERE 子句
- 先来看看什么是书签查找: 当优化器所选择的非聚簇索引只包含查询请求的一部分字段时,就需要一个查找(lookup)来检索其他字段来满足请求。对
- CSS Sprites技术早在2005年 CSS Zengarden 的园主 Dave Shea就在ALA发表对该技术的详细阐述。原先只在C
- 此文档是一位高手同事Hewei的原创实践总结,过程真是精彩,最后修复损坏数据库取得圆满效果,值得收藏的一篇好文章。前几天因为mysql数据库
- 作者:F. Permadi译者:Sheneyan(子乌)英文原文: INTRODUCTION TO JavaScript Functions
- 一个封装好的JavaScript拖动类,使用方便:<div id="idDrag" style="bor
- 可怜我的C盘本来只有8.XG,所以不得不卸载掉它。卸载掉本身没啥问题,只是昨晚突然发现 Sql Server 2008 R2 Managem
- 一.WITH AS的含义 WITH AS短语,也叫做子查询部分(subquery factoring),可以让你做很多事情,定义一个SQL片
- 来到杭州,迅速租了房子,扫了日常用品。再非专业地提前体验一下与工作有那么一点点点点点相关的UED(用户体验设计)。良好的用户体验是一种非必须
- 连续看到几个和 Oracle 优化器隐含参数 _sort_elimination_cost_ratio 相关的优化案例(Refer Refe
- 前不久听到这样一个面试的故事:面试官:你准备在我们公司做些什么事情?(大致这个意思)面试人:我准备在公司做网站重构,把原来是table的页面
- 很多人在使用AJAX调用别人站点内容的时候,JS会提示"没有权限"错误,这是XMLHTTP组件的限制-安全起见禁止访问非
- 我们开发数据库应用时,常常需要用到模糊查询。如果同一个条件需要匹配很多字段怎么办呢?通常,程序员会每个字段都在SQL中“field like
- 1. 相对与比较老的环境,建议使用第二个 set dbconnection=Server.CREATEOBJECT("ADODB.
- 我听说在ASP里,可以不用DSN来连接EXCEL,请问如何实现?确实ASP提供了替代DSN的其他方法,甚至可以在运行时建立连接看看下面的范例
- 1.漏洞介绍在XHTML 1.0标准下,使用特殊构造的CSS样式,在Internet Explorer 7.0
- 1.11 – 添加缎带修饰网页局部模块中右上角的蓝色缎带修饰是这个网站界面设计中的一个亮点,只要合理的运用CSS、PNG透明图片和绝对定位属