前端零基础学习Day-Four

搭建网页结构

<div>标签（块级）：是一个区块容器标记，<div></div>之间是一个容器，可以包含段落、表格、图片等各种html元素

<span>标签（行内）：没有实际意义，为了应用样式

• 块级标签：占据一行，换行

<div> <ul> <ol> <li> <dl> <dt> <dd> <h1> <p> <form> <hr>

• 行内(内联)标签：在一行，不换行

<b> <em> <img> <input> <a> <sup> <sub> <textarea> <span>

---

1. 行内元素（Inline Element）：指在页面中水平排列，并且不会独占一行的元素。常见的行内元素有 <span>、<a>、<strong>、<em> 等。行内元素的特点是它们不会自动换行，并且其宽度和高度由其内容决定。

2. 行内块元素（Inline-Block Element）：行内块元素结合了行内元素和块级元素的特点。它们在页面中水平排列，但是可以设置宽度、高度、内边距和外边距等属性，且可以包含其他块级元素。常见的行内块元素有 <img>、<input>、<button> 等。

3. 块级元素（Block Element）：指在页面中独占一行，并且会自动换行的元素。常见的块级元素有 <div>、<p>、<h1> 到 <h6>、<ul>、<ol>、<li> 等。块级元素的特点是它们会独占一行空间，并且可以设置宽度、高度、内边距和外边距等属性。

4. 内联标签（Inline Tag）：这个术语通常用来描述 HTML 元素，指的是不会独占一行的元素，其内容可以与其他内容在同一行上显示，不会破坏当前文本的排列。行内元素就是内联标签的一种常见形式。

5. 块级标签（Block Tag）：通常用来描述 HTML 元素，指的是独占一行的元素，其内容会从新的一行开始显示。大多数块级元素都是块级标签。

---

标签嵌套规则：

• 块级元素可包含行内元素和某些块级元素

• 行内元素不能包含块元素，只能包含其他行内元素

• 块级元素不能放在<p>标签内

• 特殊块级元素只能包含行内元素，不能再包含块级元素。如：h1~h6、p、dt

• 块级元素与块级元素并列，行内元素与行内元素并列

---

熟悉网页结构：

查看html结构：火狐浏览器的webdeveloper插件