<div>是块级元素
浏览器会在其前后显示折行
<span>是行内元素
在默认情况下,由于span是行标签,设置width是无效的.只有改变display的属性,才可以实现设置宽度。
块级元素 block:
- 自动换行。
- 元素宽度在不设置的情况下,是它本身父容器的100%。
例子:<h1>, <p>, <ul>, <table>,<div>
行内元素 inline:
1.元素的高度、宽度及顶部和底部边距不可设置;
2.设置margin,左右有效,上下无效;设置padding,上下左右都有效,即会撑大空间
3.不能自动换行
- 元素的宽度就是它包含的文字或图片的宽度,不可改变。
例子:<b>, <td>, <a>, <img>,<span>
行内块级元素 inline-block:
1、和其他元素都在一行上;
2、元素的高度、宽度、行高以及顶和底边距都可设置。