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 ...
随机推荐
- java笔记----JVM内存
运行时数据区包括:虚拟机栈区,堆区,方法区,本地方法栈,程序计数器 虚拟机栈区 :也就是我们常说的栈区,线程私有,存放基本类型,对象的引用和 returnAddress ,在编译期间完成分配. 堆区 ...
- [20180926]查询相似索引.txt
[20180926]查询相似索引.txt --//有时候在表上建立索引比如A,B字段,可能又建立B字段索引,甚至A字段索引以及B,A字段索引,或者还建立C,A字段索引,--//需要有1个脚本查询这些索 ...
- ASP.Net上传文件
在做Web项目时,上传文件是经常会碰到的需求.ASP.Net的WebForm开发模式中,封装了FileUpload控件,可以方便的进行文件上传操作.但有时,你可能不希望使用ASP.Net中的服务器控件 ...
- VS调式时出现异常，在输入法是中文状态下，输入框输入字母再回车，会造成页面关闭，vs退出调式
解决方案:关闭浏览器窗口关闭时,停止调试 .就恢复正常,无异常
- Node 各个版本支持ES2015特性的网站
如果想了解Node 各个版本支持ES2015到那个程度,可以看下面网站. https://node.green/
- Windows平台搭建-----C语言
上期我们已经进行Linux的平台搭建,今期我们就来搭建下我们最常用的.最适合初学者的一种方式,那就是搭建Windows平台开发环境,只需要两种工具即可,一个就是编辑器(编辑代码的工具),另一个就是编译 ...
- 【算法】LeetCode算法题-Valid Parentheses
这是悦乐书的第147次更新,第149篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第6题(顺位题号是20),给定一个只包含字符'(',')','{','}','['和'] ...
- AOP的底层实现：JDK动态代理与Cglib动态代理
转载自 https://www.cnblogs.com/ltfxy/p/9872870.html SpringAOP底层的实现原理: JDK动态代理:只能对实现了接口的类产生代理.(实现接口默认JDK ...
- 【ctags/cscope/project安装使用】给神编辑器vim添加新的翅膀
本文地址 分享提纲: 1.安装 2.使用cscope 3.使用project 1.安装 1.1)linux(yum下安装) yum -y install cscope 1.2)linux(unbunt ...
- Ajax的beforeSend
巧用Ajax的beforeSend 提高用户体验 jQuery是经常使用的一个开源js框架,其中的$.ajax请求中有一个beforeSend方法,用于在向服务器发送请求前执行一些动作.具体可参考jQ ...