進度條線上課程-09.選擇器

HTML <div> 標簽

定義和用法

<div> 可定義文檔中的分區或節（division/section）。

<div> 標簽可以把文檔分割为獨立的、不同的部分。它可以用作嚴格的組織工具，並且不使用任何格式與其關聯。

如果用 id 或 class 來標記 <div>，那麼該標簽的作用會變得更加有效。

用法

<div> 是一個塊級元素。這意味着它的內容自動地開始一個新行。實際上，換行是 <div> 固有的唯一格式表現。可以通過 <div> 的 class 或 id 應用額外的样式。

不必为每一個 <div> 都加上類或 id，雖然這样做也有一定的好處。

可以對同一個 <div> 元素應用 class 或 id 屬性，但是更常見的情況是只應用其中一種。這兩者的主要差異是，class 用於元素組（類似的元素，或者可以理解为某一類元素），而 id 用於標識單獨的唯一的元素。

section=~div

HTML <style> 标签

定义和用法

<style> 标签用于为 HTML 文档定义样式信息。

在 style 中，您可以规定在浏览器中如何呈现 HTML 文档。

type 属性是必需的，定义 style 元素的内容。唯一可能的值是 "text/css"。

style 元素位于 head 部分中。

HTML <p> 标签

定义和用法

<p> 标签定义段落。

p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间，您也可以在样式表中规定。

HTML id 属性

定义和用法

id 属性规定 HTML 元素的唯一的 id。

id 在 HTML 文档中必须是唯一的。

id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。

故在同一個文檔中id不可重複

HTML 超連結

各式超連結種類語法

超連結種類	超連結語法	呈現結果
網頁超連結語法	<a href="連結網址">連結名稱</a>	連結名稱
電子郵件連結語法	<a href="mailto:電子郵件信箱">寄信給我</a>	寄信給我
FTP 超連結語法	<a href="FTP 的網址">FTP 名稱</a>	FTP 名稱

以上三個較為常用，請自行嘗試寫寫看，表格最後一欄的呈現結果使用的是所謂的＂假連結＂，也就是寫成「a href="#"」這樣，瀏覽器會自動判斷為假連結，通常用來預覽使用，並沒有真正的超連結效果。

HTML <br> 标签

TIY 实例

换行

本例演示如何在文档中插入换行符。

定义和用法

<br> 可插入一个简单的换行符。

<br> 标签是空标签（意味着它没有结束标签，因此这是错误的：<br></br>）。在 XHTML 中，把结束标签放在开始标签中，也就是 <br />。

请注意，<br> 标签只是简单地开始新的一行，而当浏览器遇到 <p> 标签时，通常会在相邻的段落之间插入一些垂直的间距。

HTML 換行 br 與 p 標籤

HTML 本來就是用來編輯網頁內容的一種語法，當然對於本文的編排就會有所謂的換行或段落這樣的功能，在 HTML 中，換行有兩個常見的標籤，分別是 <br> 與 <p>，其中 <br> 標籤代表的是換一行，而 <p> 標籤則會換兩行，<p></p> 標籤本身也是段落的意思。

HTML 換行範例

這是第一行<br>
這是第二行<p>
這是第三行

呈現結果就是

這是第一行
這是第二行

這是第三行

可以看到第一行與第二行的距離只有換一行，第三行則因為使用了 <p> 標籤，而換了兩行。