块级元素的特征:
块级元素有哪些?
<hn>...</hn> 标题标签
<hr> 水平分割线
<p>...</p> 段落
<ul>...</ul> 无序列表
<ol>...</ol> 有序列表
<dl>...</dl> 定义列表
<table>...</table> 表格
<form>...</form> 表单
<div>...</div>布局标签
行内元素的特征:
行内元素有哪些?
<span>...</span>
<a>...</a> 链接
<br> 换行(空标签,不深究)
<b>...</b> 加粗、倾斜、下划线、删除线等文本装饰标签
<select>...</select> 下拉列表
行内元素特性
常用的行内块级inline-block标签:
<img />图片标签
<input>输入框
<textarea>文本域/多行输入框
<td>单元格
<select>下拉框
<button>按钮
元素模式转换
display属性用于元素转换
通过以上发现->内联元素无法直接设置宽高、对块级元素设置宽高才可以奏效。
如果想使元素类型/模式转换,则可以使用display进行转换。
常用元素特性
(1)block块级元素
块级元素特性:自动换行,可以直接设置宽高
(2)inline内联/行内元素
不换行,无法设置宽高
(3)inline-block 行内块级元素
既拥有行内元素特性,又有块级元素特性。不换行且可以直接设置宽高。
(4)none隐藏元素
设置为none后则会隐藏元素,在页面彻底蒸发