<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>题目</title>
</head>
<body>
<div style="background-color: brown; display: inline">它默认为块级标签，这里强行改为行内标签</div>
<span style="background-color: greenyellow; display: block">它默认为行内标签，这里强行改为块级标签</span>
<div style="background-color: hotpink">yiqing</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>题目</title>
</head>
<body>
<span style="background-color: red; height: 100px; width: 70px;">YiQing</span>
<!--这里改了高度和宽度，可是，实际上什么都没有改变-->
<!--行内标签无法设置高度和宽度-->
<a style="background-color: green;height: 100px; width: 70px;">XYQ</a>
<!--因为a标签也是行内标签，它也无法设置，只有块级标签可以这样操作-->
<br><br>
<span style="display: inline-block; background-color: blue; height: 100px; width: 70px;">YiQing</span>
<!--加上这样的操作，发现改变成功了
此时，它既有inline的属性，又有block的属性-->
</body>
</html>
<!--还有一个display: none,这里用不到，用于JS-->
