HTML标签类型
HTML有N多标签，根据显示的类型，主要可以分为3大类
块级标签
独占一行的标签 能随时设置宽度和高度（比如div、p、h1、h2、ul、li）
行内标签（内联标签）
多个行内标签能同时显示在一行 宽度和高度取决于内容的尺寸（比如span、a、label）
行内-块级标签（内联-块级标签）
多个行内-块级标签可以显示在同一行 能随时设置宽度和高度（比如input、button）
修改标签的显示类型
CSS中有个display属性，能修改标签的显示类型
none：隐藏标签
block：让标签变为块级标签
inline：让标签变为行内标签
inline-block：让标签变为行内-块级标签（内联-块级标签）
<html lang="en">
<head>
<meta charset="UTF-8">
<title>常见的标签的类型</title>
<style>
div{
background-color: red;
width: 200px;
height: 80px;
/*隐藏标签*/
/*display: none;*/
/*改变标签的类型: 块级--->行内标签*/
/*display: inline;*/
/*改变标签的类型: 块级--->行内-块级标签*/
display: inline-block;
}
p{
background-color: yellow;
width: 100px;
height: 80px;
/*改变标签的类型: 块级--->行内标签*/
/*display: inline;*/
/*改变标签的类型: 块级--->行内-块级标签*/
display: inline-block;
}
span{
background-color: aqua;
width: 300px;
height: 90px;
/*改变标签的类型: 行内--->块级标签*/
/*display: block;*/
/*改变标签的类型: 行内--->行内-块级标签*/
/*display: inline-block;*/
}
button{
width: 100px;
height: 80px;
}
</style>
</head>
<body>
<!--块级标签-->
<div>div标签</div>
<p>段落标签</p>
<!--行内标签(内联标签)-->
<span>我是行内标签</span>
<span>我是行内标签</span>
<span>我是行内标签</span>
<a href="#">我是超链接</a>
<a href="#">我是超链接</a>
<!--行内-块级标签-->
<input>
<button>我是按钮</button>
<button>我是按钮</button>
</body>
</html>