CSS中使用浮动会有哪些影响
Admin 2022-07-29 群英技术资讯 557 次浏览
1、背景不能显示(overflow:hidden)。
由于浮动产生,如果对父级设置了(css background背景)CSS背景颜色或CSS背景图片,而父级不能被撑开,所以导致CSS背景不能显示。
2、边框不能撑开,如果父级设置了CSS边框属性,子级里使用了float属性产生浮动,父级不能被撑开。
3、margin padding设置值不能正确显示。
由于浮动导致父级子级之间设置css padding,css margin 属性的值不能正确表达,特别是上下边的padding和margin不能正确显示。
实例
<head> <style type="text/css"> *{ margin:0; padding:0;} //取消设置 如 li 留下的那个实点 ul{ width:900px; border:3px dotted red; list-style:none; overflow: hidden;}//overflow:hidden :让行高自适应 .left{ width:300px; height:300px; background:#FF0; float:left;} //float:left设置浮动全部向左排 .chent{ width:300px; height:300px; background:#000; float:left} .right{ width:300px; height:300px; background:red; float:left} </style> </head> <body> <ul> <li></li> <li></li> <li></li> </ul> </body>
本文教程操作环境:windows7系统、css3版,DELL G3电脑。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
CSS中motion path模块的介绍:1、利用这个规范规定的属性,我们可以控制元素按照特定的路径进行位置变换的动画。2、CSS传统方式可以实现直线路径动画。
在这篇文章中我们来了解一下13个常用CSS字体样式属性,下文有实例供大家参考,对大家了解操作过程或相关知识有一定的帮助,而且实用性强,希望这篇文章能帮助大家,下面我们一起来了解看看吧。
方法:1、利用width和height属性,将元素设置为高度值大于宽度值的矩形;2、利用“border-radius”属性,将矩形元素设为上下尖角的椭圆,只需要给矩形元素添加“border-radius:100%;”样式即可。
当内容的长度超过了我们的期望值,我们也无法解释其中的可能性,页面的设计很可能会因此而崩掉。这篇文章主要介绍了详解在CSS中解决内容过长的问题,感兴趣的小伙伴们可以参考一下
这篇文章主要给大家分享关于CSS中层叠上下文的内容,本文对层叠上下文的概念、特性及使用都有详细的介绍,感兴趣的朋友可以参考,接下来跟随小编来学习一下吧。
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008