html中有这样一行代码:
<DL>
... //标签行
</DL>
如何控制上述标签行的背景颜色(注:是整行的背景色,不是字体的颜色)?
12 个解决方案
<DL id="a">
... //标签行
</DL>
然后就可以用javascript控制a
的样式了
楼上用#fff...白色底色??
<style>
dl{background-color:red;}
</style>
<DL>
... //标签行
</DL>
//test.html
<div class="product_intro">
<div class="t"><img src="images/product_intro.jpg" border="0" alt="" /></div>
<div class="c">
<ul>
<li><img src="uploadfile/product/06.jpg" border="0" alt="" /><div>asfdsadfa</div></li>
<li><img src="uploadfile/product/06.jpg" border="0" alt="" /><div>asfdsadfa</div></li>
<li><img src="uploadfile/product/06.jpg" border="0" alt="" /><div>asfdsadfa</div></li>
<li><img src="uploadfile/product/06.jpg" border="0" alt="" /><div>asfdsadfa</div></li>
<li><img src="uploadfile/product/06.jpg" border="0" alt="" /><div>asfdsadfa</div></li>
<li><img src="uploadfile/product/06.jpg" border="0" alt="" /><div>asfdsadfasfdsadfaasfdsadfaasfdsadfaasfdsadfaa</div></li>
</ul>
</div>
</div>
<div id="lefter">
<div class="business_intro">
<div class="t"><img src="images/business_intro.jpg" border="0" alt="" /></div>
<div class="c">asfdsa</div>
</div>
<div class="branch_intro">
<div class="t"><img src="images/branch_intro.jpg" border="0" alt="" /></div>
<div class="c">34</div>
</div>
<div class="news_products">
<div class="t"><img src="images/news_products.jpg" border="0" alt="" /></div>
<div class="c">d</div>
</div><div class="clear"></div>
</div>
<div id="righter">
<div class="same_fur_t">
<div class="t">不用JAVA罢了</div>
<div class="c_1"></div>
</div>
<div class="advance"><img src="uploadfile/banner/05.jpg" border="0" alt="" /></div>
<div class="same_fur_t">
<div class="t">不用JAVA罢了</div>
<div class="c_3"></div>
</div>
<div class="same_fur_t">
<div class="t">不用JAVA罢了</div>
<div class="c_4"></div>
</div>
<div class="advance"><img src="uploadfile/banner/05.jpg" border="0" alt="" /></div>
<div class="same_fur_t">
<div class="t">不用JAVA罢了</div>
<div class="c_2"></div>
</div>
</div>
这么一段代码样式如下
//main.css
#lefter{float:left;width:595px;}
#righter{float:left;width:325px!important;width:320px;}
/*Product List Style*/
.product_intro{float:left;width:100%;margin:5px 0 0 0;}
.product_intro .c{padding:10px;border:1px solid #9BBDD3;height:134px;}
.product_intro ul{}
.product_intro li{float:left;width:13%;height:127px;padding:0px 16px;text-align:center;line-height:20px;overflow:hidden;}
/**/
.branch_news,.business_intro,.branch_intro,.news_products{float:left;width:590px;margin:5px 5px 0 0;}
.branch_news .t{padding:0px;height:26px;}
.branch_news .c{clear:both;height:253px;padding:10px;border:1px solid #9BBDD3;}
.branch_news .pic{width:232px;line-height:17px;text-align:center;float:left;}
.branch_news .b_n_list{width:310px;float:left;padding:0 0 0 17px;}
.branch_news .b_n_list ul{}
.branch_news .b_n_list li{clear:both;height:25px;line-height:25px;font-size:14px;overflow:hidden}
/*Public mode Style*/
.same_fur_t{float:left;width:325px!important;width:320px;margin:5px 0 0 0;}
.same_fur_t .t{clear:both;background:url(../images/same_fur_t.jpg) no-repeat;height:24px;line-height:24px;}
.same_fur_t .c{clear:both;padding:10px;border:1px solid #9BBDD3;height:255px;}
.same_fur_t .c_1{clear:both;padding:10px;border:1px solid #9BBDD3;height:298px;}
.same_fur_t .c_2{clear:both;padding:10px;border:1px solid #9BBDD3;height:150px;}
.same_fur_t .c_3{clear:both;padding:10px;border:1px solid #9BBDD3;height:238px;}
.same_fur_t .c_4{clear:both;padding:10px;border:1px solid #9BBDD3;height:305px;}
.same_fur_t .pic{}
/**/
.business_intro .c{clear:both;height:145px;padding:10px;border:1px solid #9BBDD3;}
/**/
.branch_intro .c,.news_products .c{clear:both;height:370px;padding:10px;border:1px solid #9BBDD3;}
郁闷的事,firefox里完整,在maxthon里,及ie7.0,ie6.0变态的要死,宽度,都 定死的,居然会中间空隙很大,朋友,你拷一下代码试试看看
最好用个id 不然所有的dl都会是这个颜色
<style>
#dl{background-color:red;}
</style>
<DL id="dl"> xcz</DL>