html去掉父元素样式,CSS清除浮动使父级元素展开的三个方法
一個沒有設置高度的容器div內如果存在浮動元素(即使用了屬性float:left或者float:right)，那么該父級元素會無法展開。
為了使父級元素展開，有三種方法：
第一：設置父級元素的高度，但是要事先知道內容的高度，這里內部的元素高度是100像素，加上上下邊框高度2像素，一共是102像素。
復制代碼
代碼如下:
.content {
width:500px;
border:1px solid red;
height:102px;
}
.left {
width:100px;
height:100px;
border:1px dashed blue;
float:left;
}
.right {
width:100px;
height:100px;
border:1px dashed green;
float:right;
}
第二：添加樣式，并在父級元素結束標簽前添加both:clear樣式。
復制代碼
代碼如下:
.content {
width:500px;
border:1px solid red;
}
.left {
width:100px;
height:100px;
border:1px dashed blue;
float:left;
}
.right {
width:100px;
height:100px;
border:1px dashed green;
float:right;
}
.clear {
clear:both;
}
第三：添加overflow屬性：
復制代碼
代碼如下:
.content {
width:500px;
border:1px solid red;
overflow:hidden;
}
.left {
width:100px;
height:100px;
border:1px dashed blue;
float:left;
}
.right {
width:100px;
height:100px;
border:1px dashed green;
float:right;
}
總結
以上是生活随笔為你收集整理的html去掉父元素样式,CSS清除浮动使父级元素展开的三个方法的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 芦溪中学2021高考成绩查询,三台县芦溪
- 下一篇： 成都东软学院计算机科学与技术系,成都东软