H5 65-清除浮动方式一
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>65-清除浮动方式一</title>
<style>
*{
margin: 0;
padding: 0;
}
.box1{
height: 20px;
background-color: red;
}
.box2{
background-color: green;
}
.box1 p{
width: 100px;
background-color: blue;
}
.box2 p{
width: 100px;
background-color: yellow;
}
p{
float: left;
}
</style>
</head>
<body>
<!--
1.清除浮动的第一种方式
给前面一个父元素设置高度 注意点:
在企业开发中, 我们能不写高度就不写高度, 所以这种方式用得很少
-->
<div class="box1">
<p>我是文字1</p>
<p>我是文字1</p>
<p>我是文字1</p>
</div> <div class="box2">
<p>我是文字2</p>
<p>我是文字2</p>
<p>我是文字2</p>
</div>
</body>
</html>
H5 65-清除浮动方式一的更多相关文章
- 前端之float的几种清除浮动方式
前端之float的几种清除浮动方式 本节内容 1.float清除方式1 2.float清除方式2 3.float清除方式3 4.float清除方式4 1.float清除方式1 <!DOCTYPE ...
- 第五篇：web之前端之float的几种清除浮动方式
前端之float的几种清除浮动方式 前端之float的几种清除浮动方式 本节内容 1.float清除方式1 2.float清除方式2 3.float清除方式3 4.float清除方式4 1.flo ...
- HTML连载50-伪元素选择器、清除浮动方式五
一.伪元素选择器 1.什么是伪元素选择器 伪元素选择器作用给指定标签的内容前面添加一个子元素,或者给指定标签的内容后面添加一个子元素. 2.格式: 标签名称::before{ 属性名称:值: } 给指 ...
- css浮动（folat），清除浮动（clear）（另加两种清除浮动方式，总共三种清除浮动方式）
css浮动(float) float是css样式,用于设置标签的居左浮动和居右浮动,浮动后的元素不属于html文档流,需要用清除浮动把文档拽回到文档流中 浮动值: left:向左浮动 right:向右 ...
- H5 70-清除浮动方式五
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- H5 69-清除浮动方式四
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- H5 67-清除浮动方式三
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- H5 66-清除浮动方式二
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- css清除浮动方式总结
1.通过父元素overflow:hidden,缺点:超出部分隐藏,不推荐使用 <!DOCTYPE html> <html lang="en"> <he ...
随机推荐
- RMAN-06172 Troubleshooting
今天在RMAN还原测试过程中,遇到了"RMAN-06172: no autobackup found or specified handle is not a valid copy or ...
- MS SQL作业Schedule的限制注意事项
最近遇到了一个关于MS SQL作业Schedule下有限制的特殊案例,有一个作业,用户要求执行的时间为:9:30,14:30,16:30, 19:00,于是我设置了两个Schedule,其中一个每 ...
- EXT.NET初学
1.ext:Hidden 必须在body里面有ext:ResourceManager的情况下才能运行 2.ext:Store里面不能有文字
- spring applicationContext.xml最全约束
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...
- c/c++ 标准库 map set 插入
标准库 map set 插入 一,插入操作 有map如下: map<string, size_t> cnt; 插入方法: 插入操作种类 功能描述 cnt.insert({"abc ...
- wordpress安装后访问博客只显示文字的解决办法
按着网上的教程,买了腾讯云服务器,上面的镜像已经安装好WordPress了.但是发现并不像网上十分钟搭建个人站点等的写的那么简单.遇到了一些问题,下面来详细讲一讲. 首先是用ip地址不能直接访问服务器 ...
- Linux 忘记登录密码？破解系统登陆密码
1.重启或者开启系统,在如下界面按e 进入救援系统: 2.在linux16 这一行末尾输入:rd.break,以rd.break 的方法重置密码 3.分别执行以下命令 mount -o remount ...
- 聚类——WKFCM
聚类——认识WKFCM算法 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 参考文献:Shen H, Yang J, Wang S, et al. At ...
- Python虚拟环境笔记
虚拟环境 为什么需要虚拟环境: 到目前位置,我们所有的第三方包安装都是直接通过pip install xx的方式进行安装的,这样安装会将那个包安装到你的系统级的Python环境中.但是这样有一个问题, ...
- Should we ban guns 英语禁枪议论文
Should we ban guns ? 我们应该禁枪吗? 英语议论文 Should we ban guns? Author:Pleiades_Antares(www.cnblogs.com/iris ...