两个css郁闷的发现
作者:warran 来源:一路上有鱼 发布时间:2007-12-16 15:31:00
1、最郁闷的发现!!
先看代码:
不要运行,猜猜,页面中的字是red还是blue?
运行一下,颜色是red....
也就说这句:#b #c span{color:blue;} 没能覆盖前面那句
如果把这句改成 #a #b #c span{color:blue;} ,字就是blue了
改成#body #b #c span{color:blue;} ,也是blue
甚至 #body #a #b span{color:blue;} 也是blue
多次试验,最终我得出一点,标签用id,也就是css里用#...定义的,后面如果要覆盖前面的属性值,居然要比数量。。。。第二次的#号数量要大于等于前面#的数量。
有点无语。。。不知道这是bug还是什么。。。?
2、比较郁闷的发现
先看html:
<ul id="menu">
<li><a href="#">公司简介</a></li>
<li<a href="#">对应业种及优点</a></li>
<li<a href="#">业务承担形式</a></li>
<li<a href="#">人才派遣形式</a></li>
<li<a href="#">收费职业介绍形式</a></li>
<li<a href="#">免费事项</a></li>
<li<a href="#">FC招聘</a></li>
<li<a href="#">邮箱</a></li>
</ul>
一组列表,现在,我们要这些li,横向显示,加css样式。
<style>
#menu li{float:left}
</style>
<ul id="menu">
<li><a href="#">公司简介</a></li>
<li<a href="#">对应业种及优点</a></li>
<li<a href="#">业务承担形式</a></li>
<li<a href="#">人才派遣形式</a></li>
<li<a href="#">收费职业介绍形式</a></li>
<li<a href="#">免费事项</a></li>
<li<a href="#">FC招聘</a></li>
<li<a href="#">邮箱</a></li>
</ul>
没有问题,现在要做滑动门效果,首先给li设置一个背景图片,左对齐。给a设置个背景,右对齐,互相覆盖,最终形成自适应大小的滑动门。
背景图片高度为32px。因为要给a标签设置高度,所以要设置a的显示形式为block,因为a的宽度不是固定的,所以不能设置一个固定的值。代码如下:
好了,问题出现了。。。。。。。。。。。。(ie6下出问题)
由于设置了display:block,并且未给标签“a”设置width,所以“a”的width,ie6是默认为100%的。所以就不是在一行显示了。
开始的时候,我还以为是float:left失效。
我还修改“a”的width为 auto,但都是没用的。auto在ie6下,就是100%。
最终,我发现,解决办法是。。。。。给“a”设置float:left
看效果:
问题解决
另外说一点,这样做,在dw cs3里,显示是一个字的宽度,其它的字被挤到下面。听说dw cs3内置的是opera的解释器,但我在opera下测试,显示也是正常的,与ff ie显示效果一样。
为了不影响在dw下制作时看到的效果,可以给a设置overflow:hidden
猜你喜欢
- If...Then...Else 语句的一种变形,即添加任意多个 ElseIf 子句以扩充 If...Then...Else 语句的功能,允
- 阅读:Chapter 3 * 的表格“Misquotations are the only quotations tha are never
- 论坛上看到有人问ASP是否可以定时触发事件,我就顺便做了一个玩玩。其实做这个的原理是很简单的,只是我们当时没有仔细的去想想该怎么实现,我这里
- 1、Dreamweaver中的复制我在网页中复制的文字,粘贴到Dreamweaver中时,它总是带有原来网页的格式,请问如何只复制其中的文本
- asp如何显示全部的环境变量?<%@Language="VBScript"%><%dim H
- 阅读上一篇:AJAX的jQuery实现入门(一)要写入数据库,我们知道的最简单的就是注册了, 就做个最简单的注册表单, 看看是如何提交数据的
- blur事件在元素失去焦点时触发。在一些jquery的教程、api手册等上面对blur事件,提供了一个错误的例子,就是关于p标签失去焦点的问
- 工作中,网页设计师经常会遇见这些状况:时间这么短又要出彩、又是要大气要有气氛、风格不明确很难把握、栏目这么多页面又这么长……突然觉得束手无策
- 我们平常在网页上显示的字体最小一般是12PX,当小于10PX时,显示的效果就大打折扣了,因为中文默认的字体是宋体,当小于12PX时的效果如下
- 网站,(100-1)%的内容是导航1、Jesse James Garrett 在《用户体验要素》一书中提到了多重导航系统:全局导航、局部导航
- 是在客户端确认还是在服务器端确认? <SCRIPT LANGUAGE="VBSc
- 以下是SQL连接代码: 代码如下:Function Open_conn() dim Conn,Strconn&
- 我很想自己写一个这样的程序,不过wordpress是php的,我blog是ASP的,只好用ASP写代码了。经过一番折腾测试,终于让我的梦想变
- 这里使用FSO对象来删除指定文件夹 代码和说明如下:<% set fs=createobject(&qu
- 当我们使用访问一个没有声明的变量时,JS会报错;而当我们给一个没有声明的变量赋值时,JS不会报错误,相反它会认为我们是要隐式申明一个全局变量
- 数据字典是Oracle存放有关数据库信息的地方,其用途是用来描述数据的。比如一个表的创建者信息,创建时间信息,所属表空间信息,用户访问权限信
- 当你连接到MySQL服务器时,你应使用一个密码。密码不以明文在上传输。客户端连接序列中的密码处理在MySQL 4.1.1中已经升级,很安全。
- 最近群里好多人讨论oracle安全问题,今天找了些资料学习了下 获取Oracle当前会话的一些属性 (对于sql注射的环境判断很有用哦) S
- 以下为测试例子。 1.首先创建两张临时表并录入测试数据: 代码如下:create table #temptest1 ( id i
- 我用FSO生成了unicode的文件,但这不是我想要的。FSO可以生成utf-8格式编码的html文件吗?用什么办法才能生成?FSO的编码问