码迷,mamicode.com
首页 > Web开发 > 详细

html浮动

时间:2018-11-09 16:24:44      阅读:1362      评论:0      收藏:0      [点我收藏+]

标签:float   flow   没有   sla   使用   默认   oom   属性   出现   

  • 浮动元素的特征有:
    1.块在一排显示;
    2.内联元素支持宽高;
    3.无论是块元素还是内联元素,没有宽度时默认内容撑开宽度;
    4.脱离文档流;
    5.提升层级半级。
  • 对其他浮动元素的影响:后浮动的元素永不会超过先浮动元素的顶端。
  • 对普通元素的影响:浮动元素会从文档正常流中删除,使得紧挨它的元素位置发生偏移,影响布局。
  • 对文字的影响:浮动元素向下延伸时,不会影响正常文本的显示,文本会相对于浮动元素进行偏移。但部分文本背景会被浮动元素遮住。
  • 八、清除浮动指什么? 如何清除浮动?
    清除浮动指的是:在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外面而影响布局的现象,为了防止这个现象的出现而进行的CSS处理,就叫CSS清除浮动。

    清除浮动的方法:
    1.使用带clear属性的空元素
    在浮动元素后使用一个空元素如<pre><div class="clear"></div></pre>,并在CSS中赋予<pre>.clear{clear:both;}</pre>属性即可清理浮动。亦可使用<pre><br class="clear" /></pre>或<pre><hr class="clear" /></pre>来进行清理。
    2.使用CSS的overflow属性
    给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动,另外在 IE6 中还需要触发 hasLayout ,例如为父元素设置容器宽高或设置 zoom:1。
    3.使用CSS的:after伪元素

html浮动

标签:float   flow   没有   sla   使用   默认   oom   属性   出现   

原文地址:https://www.cnblogs.com/fanyiman/p/9934757.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!