span与div⾏内元素和块元素(标签)
讨论span与div的区别实质是⾏内元素与块元素有什么不同
span 是 ⾏内元素
div 是 块元素
w3c关于⾏内元素与块元素的定义
块元素:块级框从上到下⼀个接⼀个地排列,框之间的垂直距离是由框的垂直外边距计算出来。
⾏内元素:⾏内框在⼀⾏中⽔平布置。可以使⽤⽔平内边距、边框和外边距调整它们的间距。但是,垂直内边距、边框和外边距不影响⾏内框的⾼度。由⼀⾏形⾏框(Line Box),⾏框的⾼度总是⾜以容纳它包含的所有⾏内框。不过,设置⾏⾼可以增加这个框的⾼度。
成的⽔平框称为⾏框(
padding是外边距还是内边距不知看懂了没有
⽤代码测试就容易验证下⾯两点
其实第⼀点块元素的宽度是占据整⾏⽽⾏内元素的宽度是根据元素内容的宽度
例如 <p>标签与 <span>标签就很容易测试出来
第⼆点 ⾏内元素 属性height width margin-top margin-bottom padding-top padding-bottom是⽆效
但是margin-left margin-right padding-left padding-right是有效的,⽽块元素全部height width margin padding都是有效的
display属性 其实就是设置标签具有⾏内元素属性特性或着是块元素属性特性 更详细的说明查⼿册
block: 设置成块元素
inline:设置成⾏内元素
inline-block: 让标签具有块元素 和 ⾏内元素的属性特性 如有疑问 ⽤代码测试最容易理解

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。