来讲讲:css的优先级和!important与ie6的BUG
在网页制作中,有许多的术语,例如:CSS、HTML、DHTML、XHTML等等。在下面的文章中我们将会用到一些有关于HTML的基本知识。网页制造poluoluo文章简介:!important在ie6下的一个BUG和CSS的优先级。
一css的优先级
明天有人跟我说csshack顶用!important来辨别ie6,由于ie6不撑持!important,是的在很早之前我也是用过这类办法写hack,可是厥后就基础不必了。原本我对他谁的ie6不撑持!important也没甚么贰言,但是恰好在头几天恰好用个这个!important属性办理了一个款式优先级的成绩,并且是撑持ie6的,这是为何呢?究竟ie6支不撑持!important呢?
起首我们来看看!important这个属性的感化:!important是用来提拔款式优先级的,我们晓得款式是有优先级的。
我们先看看css的优先级的几个基础的划定规矩:
[*]ID选择器(形如#id{})>类选择器(形如.class{})>标签选择器(形如body{}大概*{}),也就是ID选择器,类选择器,标签选择器中,ID选择器的优先级最高,标签选择器最低;
[*]选择器越详细优先级就越高,也就是
.classA.classB.classC{font-size:25px;}
.classB.classC{font-size:18px}
.classC{font-size:12px;}
这里.classA.classB.classC的优先级最高,.classC的优先级最低;
[*]在统一个级其余情形下,最初指定的划定规矩优先级就越高,也就是我们一般说的就近准绳;html中标签的style的属性都高于css文件中的选择器款式;
[*]标有”!important”的划定规矩有最高优先级。
我们能够使用!important使该款式优先级最高,比方:
CSS代码:
#idA{font-size:20px}
.classA{font-size:12px;}
HTML代码:
<divid=“idA”class=“classA”>我要20像素的字</div>
我们晓得依据下面的划定规矩能够看出#idA{font-size:20px}的款式将被援用,那我们假如要12像素的字呢?
CSS代码:
#idA{font-size:20px}
.classA{font-size:12px!important;}
HTML代码:
<divid=“idA”class=“classA”>我要12像素的字</div>
如许.classA{font-size:12px!important;}这个款式就被援用了。
这类办法在优先级低的款式被优先级高的款式掩盖,又想援用优先级低的款式时分十分有效!
二!important在ie6下的一个BUG
仍是看这一段代码,
CSS代码:
#idA{font-size:20px}
.classA{font-size:12px!important;}
HTML代码:
<divid=“idA”class=“classA”>我要12像素的字</div>
人人能够在IE6下测试一下,笔墨是12像素的,也就是.classA{font-size:12px!important;}被援用了,这证实IE6是撑持!important的。可是csshack顶用!important来辨别ie6,说ie6不撑持!important又是怎样回事呢?
本来ie6下,在统一个选择器款式(即统一个年夜括号内里)下!important是有效的,比方:
css代码:
.classA{font-size:68px!important;font-size:12px}
HTML代码:
<divclass=“classA”>我要12像素的字</div>
这里在ie6下是12像素的字,而其他扫瞄器下是68px的字,固然我们把款式改一下,!important放在前面,即.classA{font-size:12px;font-size:68px!important;},那末ie6下和其他扫瞄器一样也是68px的字。也就是在统一个选择器款式(即统一个年夜括号内里)下!important被ie6完全的忽视了。
==============以下2009年8月1日更新==============
今天在紫鼠的博客上也看到了关于!important的文章,说IE8在统一个选择器款式(即统一个年夜括号内里)下对!important的剖析也是和IE6一样的,但是我测试的情形是IE8和IE6是纷歧样的,并留了言,明天我们会商了这个成绩,的确他写的他写的代码IE8和IE6对!important的剖析是一样的。经由对照发明,他代码上没有DTD的声明,就是html代码下面的这一句:“<!DOCTYPEhtmlPUBLIC“-//W3C//DTDXHTML1.0Transitional//EN”“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>”,神啊,在没有DTD的声明的情形下,在统一个选择器款式(即统一个年夜括号内里)下,IE6,IE7,IE8对!important的剖析都是有效的。另有只需有声明文档范例的不论是html4,xhtml1.o,另有html5(“<!DOCTYPEhtml>”),撤除ie6有下面说的BUG外其他都是一般的。
更好的控制页面布局。不用多说。 我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中,我总结了四大定律:兴趣、恒心、虚心、时间。 由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。 使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。 还可以在Dreamweaver常用工具中选择超级链接,完成相应的填写即可。 HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器) 在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。 所见则所得网页编辑器的优点就是直观性,使用方便,容易上手. Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。
页:
[1]