CSS样式（块级元素、行内元素、行内块级元素以及转换）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>元素描述</title>
<style>
</style>
</head>
<body>
<!--
块级元素
典型代表:Div,h1-h6,p,ul,li
特点：1.独占一行
2.可以设置宽高
3.嵌套（包含）下，子块元素宽度（没有定义情况下）和父块元素宽度默认一致。
-->
<div>
<p>我是p1</p>
</div>
<!--
行内元素
典型代表 span,a,strong,em,del,ins
特点：1.在一行上显示
2.不能直接设置宽高
-->
<span>我是小白</span>
<a href="#">链接下</a>
<!--
行内块级元素
典型代表:input img
特点:
1.在一行上显示
2.可以设置宽高
-->
<img src="../../img/1.png" />
<!--
块级元素和行内元素的互换
块级转行内:display:inline;
行内转块级:display:block;
块、行内转行内块：display:inline-block;
-->
<div>
<span style="display: block;">我是行内转块级</span>
<div style="display: inline;">块级转行内</div>
<div style="display: inline-block;">块、行内转行内块</div>
</div>
</body>
</html>
版权声明：本文为AnyBisks原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。