美文网首页
基础知识3 浮动

基础知识3 浮动

作者: 恩德_b0c2 | 来源:发表于2017-06-11 22:45 被阅读0次

浮动
  float:left/right/none

清除浮动
  overflow:hidden  隐藏浮动效果
  clear:both       清除浮动
  :after{content:"";display:block;clear:both;}

浮动的特点

1.设置浮动的元素会脱离文本流
2.不占据页面之间
3.它位于自己的父级div内
4.可以向左或向右浮动,直到它的外边缘碰到包含框或者另一个浮动元素为止,但是不能进行上下浮动。
5.使用它来实现特殊的定位效果。
6.块级元素可以设置浮动,行内元素也可以设置浮动,设置后能够设置宽高。
7.块级元素浮动后,不会盖住行内元素。

浮动的情况

1.如果元素浮动的下方文本流有元素,那么会覆盖这个元素。
2.包含框如果不够宽,那么浮动元素会向下移动。
3.元素同时向左或者向右浮动,会在同一行显示。
4.如果前面的浮动元素比后面的浮动元素高,那么后面的浮动元素会卡在后面。

相关文章

  • 基础知识3 浮动

    浮动的特点 1.设置浮动的元素会脱离文本流2.不占据页面之间3.它位于自己的父级div内4.可以向左或向右浮动,直...

  • web学习CSS6:float浮动

    1.CSS定位机制 普通流 元素的自动样式 2.CSS Float 的 基础知识 3.使用浮动后产生的问题 4.清...

  • Python HTML和CSS 8:浮动布局

    总体内容1、浮动2、使用浮动优化上一篇博客列表制作表单3、清除浮动 一、浮动 1.1、浮动特性<1>、浮动元素有左...

  • 浮动,高度塌陷,定位

    float设置浮动: float有3个可选值,分别是:float:left向左浮动,float:right向右浮动...

  • Python3基础知识

    Python3基础知识 | 基础语法 Python3基础知识 | 编程第一步 Python3基础知识 | 基本数据...

  • CSS浮动 定位 12.09

    1. 浮动元素有什么特征?对父容器、其他浮动元素、普通元素、文字分别有什么影响? 浮动元素有3个特征: 浮动元素会...

  • 前端面试基础

    001、浮动不上去的原因 1、宽度不够浮动不上去 2、前一个元素不浮动后一个元素加了浮动你也浮动不上去 3、都加了...

  • 浮动

    float:left; float:right; 1.浮动特性 2.浮动布局 3.清除浮动的方法 方法一:额外标签...

  • 清除浮动

    3.4清除浮动总结 为什么需要清除浮动? 1、父级没有高度2、子盒子浮动了3、影响下面布局了 清除浮动的方式优点缺...

  • BFC

    1 清除浮动 2 margin 重叠 3 图片和文字环绕 图片浮动盒子+文字不浮动盒子(文字不会被压着) 4 手机...

网友评论

      本文标题:基础知识3 浮动

      本文链接:https://www.haomeiwen.com/subject/fcjkqxtx.html