float对标签的影响

1、浮动对行内属相的影响:行内属性是不支持宽高设置的,靠内容撑开高度。当设置了float属性之后,这些标签能够很好地支持宽度和高度的设置;

2、浮动对块元素的影响:部分块元素在没有设置宽高的的情况下设置浮动后变成内容撑开高度;但是还是支持设置宽高的。

3、float能解决浏览器之间解析标签时enter键造成的显示间隙问题。事实上解决这个问题,还可以是不用enter键也能解决,不过可读性不好。

4、具有浮动属性的对象在父标签中是不占有空间的。在浏览器中,如果不对父标签进行高度设置,那么父标签得高度就会是被它所包含的内容撑开,但是,一旦子标签设置浮动之后,父标签的高度就不能被撑开了,也可以理解为浮动之后的对象就像是浮在水面上一样,以至于浏览器认为这个位置是空的。下面的内容就会浮到上面来,此时就需要清除浮动。、

(解决这个问题的方法有四种:第一:给父标签设置宽高,但是这种只适用于高度固定的情况;第二:给父标签设置浮动;第三:在父标签的关标签前清除浮动。第四:直接在父标签内部设置一个“overflow:hidden”具有清除内部浮动的作用。)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,680评论 1 92
  • 一:在制作一个Web应用或Web站点的过程中,你是如何考虑他的UI、安全性、高性能、SEO、可维护性以及技术因素的...
    Arno_z阅读 4,990评论 0 1
  • (备注:凡是利用圆括号括起来的一般就是注释或者英文解释,用webstorm写程序时一定要注意字符一定要在英文状态下...
    低调桀骜红烧肉阅读 4,804评论 0 0
  • Problem Description 要求根据给定输入,按照课堂给定的快速排序算法进行排序,输出排序结果和med...
    vouv阅读 5,274评论 0 1
  • 她勇敢地把可爱的小蜘蛛一脚蹋死了,不是因为她胆大。 原因:她担心害怕小蜘蛛有毒。 小狗更容易狂吠,不是凶猛的表现,...
    9444e0643fbd阅读 38评论 0 0