H5 59-浮动元素的脱标
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>59-浮动元素的脱标</title>
<style>
.box1{
float: left;
width: 100px;
height: 100px;
background-color: red;
}
.box2{
width: 150px;
height: 150px;
background-color: blue;
}
</style>
</head>
<body>
<!--
1.什么是浮动元素的脱标?
脱标: 脱离标准流
当某一个元素浮动之后, 那么这个元素看上去就像被从标准流中删除了一样, 这个就是浮动元素的脱标 2.浮动元素脱标之后会有什么影响?
如果前面一个元素浮动了, 而后面一个元素没有浮动 , 那么这个时候前面一个元就会盖住后面一个元素
-->
<div class="box1"></div>
<div class="box2"></div>
</body>
</html>
H5 59-浮动元素的脱标的更多相关文章
- CSS---文档流布局 | 脱标-postion-zindex | 脱标-浮动
一.css文档流布局概念 1.1,什么是标准文档流 1.2,标准文档流下有哪些微观现象 二.CSS---position属性 2.1,position:relative 2.2,position:fi ...
- HTML连载45-浮动元素脱标、排序规则、贴靠现象
一.浮动元素脱标 1.什么是浮动元素脱标 脱标:脱离标准流. 当某一个元素浮动之后,那么这个元素看上去就像被从标准流中删除了一样 2.浮动元素脱标之后有什么影响 如果前面一个元素浮动了,而后面的一个元 ...
- CSS 规避脱标之两种用法
大家好,我是小强老师,今天讲解一小点知识哈 对比了才知道什么好 看不出,很漂亮吧! 有木有倾国倾城的美色. 呵呵,好多东西也是这样的,好的东西只有对比了才觉得好. 我们知道我们网页布局 有三模式. ...
- CSS.05 -- 规避脱标 定位的盒子居中、CSS标签规范、溢出隐藏、内容移除（网页优化）、CSS精灵图
规避脱标 定位的盒子居中显示 Margin:0 auto : 只能让标准流的盒子居中对齐 当A是B的父系,B可以使用 margin-left:auto: 来获得相当于定位right:0:的效果 M ...
- 李洪强和你一起学习前端之(9)规避脱标,CSS可见性,滑动门案例
1 复习昨天知识 1.1 浮动 特点: >浮动的元素不占位置(脱标) >可以将行内元素转化为行内块元素 >块级元素在一行上显示 >设置了浮动的元素,影响其后面的元素 作 ...
- CSS——规避脱标流和vertical-align
规避脱标流: 1.尽量使用标准流. 2.标准流解决不了的使用浮动. 3.浮动解决不了的使用定位. 问题解决:嵌套盒子在不使用定位的情况下定位到右上角 <!DOCTYPE html> < ...
- 关于BFC不会被浮动元素遮盖的一些解释
简介 在清除浮动一文中提到BFC不会被浮动元素遮盖,并没有详细探究表现行为.规范中指出,在同一个BFC内,作为子元素的BFC的border-box不应该覆盖同为子元素的浮动元素的margin-box. ...
- HTML。CSS浮动元素详解
浮动定位是指 1.1将元素排除在普通流之外,即元素将脱离标准文档流 1.2元素将不在页面占用空间 1.3将浮动元素放置在包含框的左边或者右边 1.4浮动元素依旧位于包含框之内 2. 浮动的框可以向左或 ...
- 使用样式“clear”和“overflow”消除浮动元素对环绕行框的影响
为元素设置“float”样式之后,元素会脱离标准文档流,不再占据原来的空间.后续元素会向前移动,占据这个新的空间.后续的文本会围绕着浮动元素分布,形成一种环绕布局的现象. 示例代码: <!DOC ...
随机推荐
- [20190319]shared pool latch与library cache latch的简单探究.txt
[20190319]shared pool latch与library cache latch的简单探究.txt --//昨天看Oracle DBA手记3:数据库性能优化与内部原理解析.pdf 电子书 ...
- mssql sqlserver 使用脚本输出excel文件的方法分享
转自:http://www.maomao365.com/?p=6683 摘要: 下文将分享使用sql脚本输出excel的方法 此脚本可以应用于 表或视图生成excel的方法,若需使用sql脚本输出ex ...
- c/c++ lambda 表达式 剖析
lambda 表达式 剖析 大前提:捕获列表里变量的确定时机. 捕获列表和参数列表有区别,捕获列表里的变量,是在捕获的时间点就确定了,而不是在lambda调用时确定,参数列表是在调用时才确定.所以当捕 ...
- Unity Editor 下创建Lua和Text文件
预览 在Project视图中,扩展右键菜单,右键 – Create - Text File 创建一个Text文件,或者Lua文件. 关键点 获取当前选择的路径,以Assets路径开头 var sele ...
- 如何让PHP程序自动执行(后台)
如何让php程序自动执行,这个就需要用到一个函数了: int ignore_user_abort ( [bool setting] ) 定义和用法 ignore_user_abort() 函数设置与 ...
- June 7. 2018 Week 23rd Thursday
Half is worse than none at all. 一知半解比一无所知更痛苦. From Westworld. If we go looking for the truth, get th ...
- linux远程目录共享
一.环境介绍 1.服务器说明: 有两台服务器,(1)101报表服务器,上面是tomcat跑的原生FineReport报表系统,(2)103业务服务器,上面是具体的业务系统. 2.需求说明: 报表文件由 ...
- 强大的Notepad++，竟然还是自由使用的
这么好用的工具,竟然还是可以自由使用的的,当然就不用去找某些软件的破解版了. 除了本身很好用,还有插件功能,插件许多也是自由使用的,利用插件就可以实现程序员需要的一个手工编辑器了.
- 《生命》第二集：Reptiles and Amphibians （爬行和两栖动物）
第二集也是一个个动物的片段,不过集中在爬行和两栖类动物上. 印度尼西亚的瀑布蟾蜍进化出神器强有力的脚,能够抓牢很多物体,是逃生的手段,同一环境下,卵石蟾蜍,能够缩紧全身肌肉,眼山坡下滑,是另一种逃生是 ...
- （转）Spring Boot 2 (九)：【重磅】Spring Boot 2.1.0 权威发布
http://www.ityouknow.com/springboot/2018/11/03/spring-boot-2.1.html 如果这两天登录 https://start.spring.io/ ...