关于DIV标签在样式冲突中的问题

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
div#blue p span{
color:blue;
}
div#red span{
color:red;
}
</style>
</head>
<body>
<div id="blue">
<p> <span> 你好1 </span> </p>
<div id="red">
<span> 你好2 </span>
</div>
</div>
</body>
</html>
上述代码中 <span> 你好1 </span> 显示为蓝色 <span> 你好2 </span>显示为红色
但如果把<p> <span> 你好1 </span> </p>改成<div> <span> 你好1 </span> </div>
即用<div>标签替换掉<p>标签后
<div id="blue">
<div> <span> 你好1 </span> </div>
<div id="red">
<span> 你好2 </span>
</div>
</div>
<span> 你好2 </span>便显示为蓝色
为什么只要把<p>标签换成<div>
<span> 你好2 </span>就会使用div#blue p span{color:blue;}样式
<div>标签有什么特别的地方吗
(*注意:<div id="red"> 是包含在 <div id="blue">中)
肯请高手 讲的详细点 另外有没关于这方面的书籍 推荐下 我有XHTML+CSS的基础
补充下 把 <p>标签换成<div> 后
样式表div#blue p span{color:blue;} 也跟着改成 div#blue div span{color:blue;}
另外下数上第4行
<span> 你好2 </span>就会使用div#blue p span{color:blue;}样式 这句中p改成div

很简单么 你看你定义的css样式 就知道了 你div#.... 这样就告诉css有个优先级别,所以你把P换成DIV就会相应的改变css样式的 明白了?

我没搞明白你得到的答案是什么,但可以告诉你 你在html中直接包含css页面和在这html中直接写css样式 你试试就知道了 是有优先级别的 我说的就是这个意思。你要是还不明白,给我留言 你不明白的地方 我会解释给你
温馨提示:内容为网友见解,仅供参考
无其他回答

什么是样式冲突
比如说:我有两个样式,index.css和Menu.css里面都有<div>标签,但是两个样式里面的内容不一样.比如:div { \/*设置层背景样式*\/ background-color:#669933;text-align:center;position:absolute;z-index:2;display:none;} div { \/*设置层背景样式*\/ background-color:#669933;text-align:center...

全局样式加 float:left 导致 div{margin:0 auto;} 不起作用,为什么?_百...
float以后,元素就浮动起来,不能加到全局,如果某个div需要浮动,就加到那个具体的类上。

网页代码<div id=" h1 h2 h3 h4"><\/div>这样可以吗,有错误吗。如果有...
ID选择器不支持像class选择器那样的多风格同时使用,所以这样的语法是完全错误的。编写CSS代码要养成良好的习惯,一个ID最多只能赋予一个HTML标记,否则将会导致JavaScript查找ID时出错。如果就对语法进行纠正,把id改为class,就正确了。他会同时把h1、h2、h3、h4的样式集于一身,如果样式之间有冲突,就...

div+css。要添上div边框颜色和实际的div大小冲突了该怎...
回答:简单的说,如果你的div宽100,高100,你要写个上下左右都是1的边框。那么,你的宽就变成了98,高98.也就是说,div实际的宽度要减去两边边框的宽度。不减的话,就错位了。

DIV+CSS,CLASS定义的属性无效
你样式引用的标签都写错了 还有可能是你忘记在页面上调取这个 CSS样式表 实在不行,最直接的方法就是 有时候你认为一个样式无效的话,你可以直接用内联样式做个试验,内联样式是优先性最高的样式类型,不受其他样式的继承关系影响 我这里已经用内联样式测试了下没问题,那肯定就是你样式引用方面出的错...

网页中引用两个css冲突怎么办?
<\/div> 那么在细化css里面,只需要在.abc前面加多一个父元素的选择符就行了:.container .abc {background:#fff} 这样.container .abc的优先级就大于了.abc,自然细化css里面的background设置也就不会被全局CSS覆盖了~~方法二 提升样式的优先级 这种方法个人不太推荐,相对而言会简单粗暴一些。同样...

CSS样式的优先级
p`之间的优先级冲突。例如,如果一个元素继承了`.son`的样式并为背景色设定了红色,同时`p`标签内嵌入了`background:red`的!important规则,那么`p`标签的背景色最终会显示为红色。通过理解并应用这些优先级规则,开发者可以更精确地控制CSS样式,避免样式冲突,从而实现更加复杂和精确的网页设计。

在div盒子里设置列表向左浮动,为什么会有一个列表元素会挤到下面去...
<div id="top">宽度不够,要略大于li的总宽度,考虑margin和padding

CSS冲突-出现等同于最后一个div容器的高度的空白-我不问了
ibox里面一定有Float这个属性吧,你用的margin属性这个时候在IE会出错,唯一的办法是就是ie做一个hack,具体如下 {margin-top:10px; *margin-top:5px;_margin-top:15px;} 结果是在FF下10px。IE6下5px,ie7下15px,具体可以自己慢慢试验,感受一下 ...

...easyUI就不显示div的样式了。并且IE9也不显示样式,firefox就可以。求...
您正确样式下,是通过js+css组合数据后实现的tab分标签展示模式。此样式对代码输出有个要求,就是先加载完数据,再加载css,最后执行js进行样式渲染,其对代码输出顺序敏感。一旦代码输出顺序换乱,就会出现js代码执行完,主对象还未生成等问题,导致undefine异常。而您说您异步获取数据,再加载入对象,此时...

相似回答
大家正在搜