[2017-03-04]行内元素和块级元素使用浮动后的变化
来源：互联网 发布：软件的权威定义 编辑：程序博客网 时间：2024/04/29 09:16
今天做前端笔试题get到一个知识点，如下所示代码
<!DOCTYPE Html><html> <body> <div style="width:400px; height:200px;"> <span style="float: left; width:100px; height: 100%;"> <i style="position:absolute; float: left; width:100px;height:50px;">hello</i> </span> </div> </body></html>
实践了一下行内元素加浮动后的效果：
height=200px; width=0px;
【原因如下】
1. span标签不是块级元素，是不支持宽高的。但是style中有了 float:left; 使span变成块级元素支持宽高，height：100%，宽度由内容撑开
2. 但<i>是绝对定位，脱离了文档流，不占父级元素空间，所以span的width=0；
0 0
- [2017-03-04]行内元素和块级元素使用浮动后的变化
- 块级元素和行内元素使用心得汇总
- 块级元素和行内元素使用心得汇总
- 行内元素和块级元素
- 块级元素和行内元素
- 行内元素和块级元素
- 行内元素和块级元素
- 行内元素和块级元素
- 块级元素和行内元素
- 行内元素和块级元素
- 块级元素和行内元素
- 行内元素和块级元素
- 行内元素和块级元素
- 行内元素和块级元素
- 块级元素和行内元素
- 行内元素和块级元素
- 行内元素和块级元素
- 行内元素和块级元素
- 类型转换
- git
- 由三部电影引发的思考
- 一. Go入门-初探interface类型
- Java生成缩略图之Thumbnailator
- [2017-03-04]行内元素和块级元素使用浮动后的变化
- Eclipse+Maven创建webapp项目<一>
- Android 反编译初探
- spark算子flatMap与textFile、saveAsTextFile结合小案例
- OpenResty 技能图谱以及学习要点
- 九年开发生涯，而立之年带着一家老小离开了奋斗的广州
- 第一个chrome extension
- Java算法-剑指offer-二叉树的深度
- 我的第一篇文章，致我曾今努力的那些年
