css中盒子内列表横放之后,给盒子添加背景颜色后,列表没有背景颜色?

html-css09

css中盒子内列表横放之后,给盒子添加背景颜色后,列表没有背景颜色?,第1张

你没有清理浮动,一般可以给浮动元素的父元素overflow:hidden,也可以给浮动元素前后加一个盒子clear:bothheight:0overflow:hidden

一般网上有个方便兼容各浏览器的写法通用写法:

.clear{clear:bothheight:0overflow:hidden}

.clearfix:after,.clearfix:before{ visibility:hiddendisplay:blockfont-size:0content:" "clear:bothheight:0}

*html .clearfix{zoom : 1} /*兼容ie6*/

*:first-child+html .clearfix{ zoom:1} /*兼容ie7*/

把上面一段代码放在你公共代码里,以后要清除浮动,只需要加一个类就行,如

<ul class="clearfix">

<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>

</ul>

或者

<ul>

<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 class="clear"></li>

</ul>

第一种方法不会产生多余空标签,两种方法看情况用

jquery使css设定好背景颜色的div去掉背景颜色,我们首先需要的就是获取到你要做这个特效的元素,jquery的话一般是都过$('#元素id'),然后在通过改css来更改这个的背景颜色,或者去掉,具体我写代码来提现:

<html>

<head>

</head>

<script>

$(function(){

$('#div1').css('background','none')

})

</script>

<body>

<div id='div1'>

<p>我没有背景颜色了</p>

</div>

</body>

</html>

这样就实现了,用jquery去掉背景颜色了。