本文小编为大家详细介绍“CSS标准文档流的基本原理是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“CSS标准文档流的基本原理是什么”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。
CSS标准文档流
标准文档流介绍
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>标准文档流</title>
</head>
<body>
<h2>微笑是最初的信仰</h2>
<span>微笑是最初的信仰</span>
</body>
</html>

标准文档流要注意的事项
空白折叠现象。
高矮不齐,底部对齐。
让我们进入空白折叠现象实践。
代码块
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>空白折叠现象</title>
</head>
<body>
加
油
<img src="./img/001.png" >
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>空白折叠现象</title>
</head>
<body>
加油<img src="./img/001.png" >
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>空白折叠现象</title>
</head>
<body>
加油<img src="./img/001.png" >
</body>
</html>

读到这里,这篇“CSS标准文档流的基本原理是什么”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注天达云行业资讯频道。