HTML|块元素和行内元素

1.块元素：

块元素：无论内容多少，该元素独占一行，比如之前学到的p标签和h1…标签，这些标签的内容就是独占一行。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>块元素和行内元素</title>
</head>
<body>

<!--
块元素：无论内容多少，该元素独占一行
比如之前学到的p标签和h1...标签，这些标签的内容就是独占一行
-->
<p>我们学习HTML</p> <p>很快乐</p>
<h1>我们学习java</h1> <h1>也很快乐</h1>

</body>
</html>

HTML|块元素和行内元素_块元素

2.行内元素

行内标签：内容撑开宽度，左右都是行内元素的可以排在一行，比如我们之前学到的粗体斜体标签，a标签等不会产生换行的标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>块元素和行内元素</title>
</head>
<body>

<!--
块元素：无论内容多少，该元素独占一行
比如之前学到的p标签和h1...标签，这些标签的内容就是独占一行
-->
<p>我们学习HTML</p> <p>很快乐</p>
<h1>我们学习java</h1> <h1>也很快乐</h1>

<!--
行内标签：内容撑开宽度，左右都是行内元素的可以排在一行
比如我们之前学到的粗体斜体标签，a标签等不会产生换行的标签
-->
<a href="https://www.baidu.com">前往百度</a>
<strong>粗体</strong>
<em>斜体</em>
<img src="../resource/image/demo01.png">

</body>
</html>

HTML|块元素和行内元素_行内元素_02

人生没有白走的路，每一步都算数！