html 加载多个class，有的只加载了一个，有的两个都加载了，为何？_html/css_WEB-ITnose

spe_top banner_top  和 spe_top banner_top 这两个分别只有一个有效
header_img spe_img 两个都有效

HTML 代码

<div class="spe_header header" style="height:150px;">	<div class="spe_top banner_top">        <div class="header_menu">            <input type="button" id="banner_open" />        </div>        <div class="banner spe_ban">            <div class="banner_x"><input type="button" id="banner_close" /></div>            <div class="banner_main speban_ul">                <ul>                    <li><a href="index.html">HOME</a></li>                    <li><a href="about.html">ABOUT</a></li>                    <li><a href="service.html">SERVICE</a></li>                    <li><a href="gallery.html">GALLERY</a></li>                    <li><a href="blog.html">BLOG</a></li>                    <li><a href=""></a>CONTACT</li>                </ul>            </div>        </div>	</div>	<div class="header_img spe_img"></div></div>

CSS代码

.spe_header{height:150px;}
.header{background:#0CC repeat;height:700px;color:white;}
.spe_top{height:150px;}
.banner_top{background:rgb(0, 229, 238) repeat;height:700px;position:relative;top:0;}
.header_img{margin:0 auto;width:70%;height:800px;background:url(../images/banner.jpg) no-repeat;background-size:cover;position:absolute;top:0;left:230px;}
.spe_img{height:150px;}

回复讨论(解决方案)

.spe_header{height:150px;}.header{background:#0CC repeat;height:700px;color:white;}.banner_top{background:rgb(0, 229, 238) repeat;height:700px;position:relative;top:0;}.header_img{margin:0 auto;width:70%;height:800px;background:url(../images/banner.jpg) no-repeat;background-size:cover;position:absolute;top:0;left:230px;}.spe_img{height:150px;}.spe_top{height:150px;}/*同样优先级的选择器，相同属性的样式，写在后面的会覆盖前面的，要把这行放到后面*/

不是这个意思啊，是有个选择器根本没效果，开始放不了图
spe_top banner_top  和 spe_top banner_top 这两个分别只有一个有效


header_img spe_img 两个都有效

.spe_header{height:150px;}.header{background:#0CC repeat;height:700px;color:white;}.banner_top{background:rgb(0, 229, 238) repeat;height:700px;position:relative;top:0;}.header_img{margin:0 auto;width:70%;height:800px;background:url(../images/banner.jpg) no-repeat;background-size:cover;position:absolute;top:0;left:230px;}.spe_img{height:150px;}.spe_top{height:150px;}/*同样优先级的选择器，相同属性的样式，写在后面的会覆盖前面的，要把这行放到后面*/

不是这个意思啊，是有个选择器根本没效果，开始放不了图
spe_top banner_top  和 spe_top banner_top 这两个分别只有一个有效


header_img spe_img 两个都有效

楼主什么结贴率？？？？
哦。。。。。
被覆盖了。

.spe_top{height:150px;}
.banner_top{background:rgb(0, 229, 238) repeat;height:700px;position:relative;top:0;}
第一个肯定不起作用 了，你看看你写的第二个样式就知道了。

赶紧结贴了吧，我都不好意思回复了！

感谢大家，主要是注释的问题，优先级也没怎么搞清楚，问题已解决