一周回顧之分享HTML筆記

1.HTML

(1)

HTML(Hypertext Markup Language)超文本標(biāo)記語(yǔ)言

它負(fù)責(zé)網(wǎng)頁(yè)的三個(gè)要素之中的結(jié)構(gòu)

HTML 使用標(biāo)簽的形式來(lái)認(rèn)識(shí)網(wǎng)頁(yè)中的不同組成部分

所謂超文本指的是超鏈接,使用超鏈接可以讓我們從一個(gè)頁(yè)面跳轉(zhuǎn)到另一個(gè)頁(yè)面

HTML 文檔包含了 HTML 標(biāo)簽及文本內(nèi)容

HTML 文檔也叫做 web 頁(yè)面

(2)

HTML 標(biāo)題(Heading)是通過(guò)<h1>-<h6>標(biāo)簽來(lái)定義的

HTML 段落是通過(guò)標(biāo)簽<p>來(lái)定義的

HTML 鏈接是通過(guò)標(biāo)簽 <a> 來(lái)定義的

HTML 圖像是通過(guò)標(biāo)簽 <img> 來(lái)定義的

2. 標(biāo)簽 (元素)

HTML 標(biāo)記標(biāo)簽通常被稱為 HTML 標(biāo)簽(HTML tag)。

HTML 標(biāo)簽是由尖括號(hào)包圍的關(guān)鍵詞,比如<html>

HTML 標(biāo)簽通常是成對(duì)出現(xiàn)的,比如<b>和</b>(可用于一級(jí)標(biāo)題)

標(biāo)簽對(duì)中的第一個(gè)標(biāo)簽是開(kāi)始標(biāo)簽,第二個(gè)是結(jié)束標(biāo)簽

開(kāi)始和結(jié)束標(biāo)簽也被稱為開(kāi)放標(biāo)簽和閉合標(biāo)簽

標(biāo)簽可以嵌套

html

預(yù)覽

<html>

? ? <head>

? ? ? ? <title></title>

? ? </head>

? ? <body>

? ? ? ? <h1>這是我的第二個(gè)網(wǎng)頁(yè)</h1>

? ? </body>

</html>

示例

解釋: 1.<p>元素::: 這個(gè)<p>元素定義了 HTML 文檔的主體,這個(gè)元素?fù)碛幸粋€(gè)開(kāi)始標(biāo)簽 <p> 以及一個(gè)結(jié)束標(biāo)簽 </p>.

2.<body>元素<body> 元素定義了 HTML 文檔的主體,這個(gè)元素?fù)碛幸粋€(gè)開(kāi)始標(biāo)簽 <body> 以及一個(gè)結(jié)束標(biāo)簽 </body>。body標(biāo)簽用來(lái)設(shè)置網(wǎng)頁(yè)的主體內(nèi)容,網(wǎng)頁(yè)中所有可見(jiàn)的內(nèi)容,都應(yīng)該在 body 中編寫(xiě)

3.<html>元素 (有且只有一個(gè)根標(biāo)簽)<html> 元素定義了整個(gè) HTML 文檔,這個(gè)元素?fù)碛幸粋€(gè)開(kāi)始標(biāo)簽 <html>,以及一個(gè)結(jié)束標(biāo)簽 </html>.

4. head 標(biāo)簽,該標(biāo)簽中的內(nèi)容,不會(huì)在網(wǎng)頁(yè)中直接顯示,它用來(lái)幫助瀏覽器解析頁(yè)面的

5. title 網(wǎng)頁(yè)的標(biāo)題標(biāo)簽,默認(rèn)會(huì)顯示在標(biāo)簽頁(yè)頂部title網(wǎng)頁(yè)的標(biāo)題標(biāo)簽,默認(rèn)會(huì)顯示在瀏覽器的標(biāo)題欄中搜索引擎在檢索頁(yè)面時(shí),會(huì)首先檢索title標(biāo)簽中的內(nèi)容它是網(wǎng)頁(yè)中對(duì)于搜索引擎來(lái)說(shuō)最重要的內(nèi)容,會(huì)影響到網(wǎng)頁(yè)在搜索引擎中的排名

HTML 標(biāo)簽參考手冊(cè)

菜鳥(niǎo)教程的標(biāo)簽參考手冊(cè)提供了有關(guān)這些標(biāo)題及其屬性的更多信息。您將在本教程下面的章節(jié)中學(xué)到更多有關(guān) HTML 標(biāo)簽和屬性的知識(shí)。

標(biāo)簽描述

<html>定義 HTML 文檔

<body>定義文檔的主體

<h1>

-<h6>

定義 HTML 標(biāo)題

<hr>定義水平線

<!--...-->定義注釋

常用標(biāo)簽

1. 標(biāo)題標(biāo)簽

在 html 中,一共有六級(jí)標(biāo)題標(biāo)簽,h1~h6,在顯示效果上,h1 最大,h6 最小h1 標(biāo)簽非常重要,它會(huì)影響到頁(yè)面在搜索引擎中的排名,一般頁(yè)面中的標(biāo)題標(biāo)簽只使用 h1,h2,h3,h3 以后的基本不使用

2. 段落標(biāo)簽

標(biāo)題標(biāo)簽用于表示內(nèi)容中的一個(gè)自然段,使用p標(biāo)簽來(lái)表示一個(gè)段落。p標(biāo)簽中的文字,默認(rèn)會(huì)獨(dú)占一行,并且段與段之間會(huì)有一個(gè)間距在 HTML 中,字符之間寫(xiě)再多的空格,瀏覽器也會(huì)當(dāng)成一個(gè)空格解析,換行也會(huì)當(dāng)成一個(gè)空格解析

3. 自結(jié)束標(biāo)簽

<br/>,<br/>表示一個(gè)換行

<hr>,<hr/>表示插入橫線img標(biāo)簽也是一個(gè)自結(jié)束標(biāo)簽

3. 注釋

可以將注釋插入 HTML 代碼中,這樣可以提高其可讀性,使代碼更易被人理解。瀏覽器會(huì)忽略注釋,也不會(huì)顯示它們。例如:<!-- 這是一個(gè)注釋 -->

4. 屬性

屬性是 HTML 元素提供的附加信息

屬性通常出現(xiàn)在 HTML 標(biāo)簽的開(kāi)始標(biāo)簽中,用于定義元素的行為、樣式、內(nèi)容或其它特性

屬性總是以 “name=value” 的形式寫(xiě)在標(biāo)簽內(nèi),name是屬性的名稱,value是屬性的值

示例: <h1>這是我的<font color="red">第二個(gè)</font>網(wǎng)頁(yè)</h1>

屬性名 = “屬性值”,一個(gè)標(biāo)簽中可以同時(shí)設(shè)置多個(gè)屬性,屬性之間需要空格隔開(kāi)

6. 實(shí)體

概述:

在 html 中,一些如< >中特殊字符是不能直接使用的,需要使用一些特殊的符號(hào)來(lái)表示這些特殊字符,這些特殊符號(hào)稱為實(shí)體(轉(zhuǎn)義字符串)

語(yǔ)法:

&實(shí)體的名字;

應(yīng)用:

<:&lt;

>:&gt;

空格:&nbsp;

版權(quán)符號(hào):&copy;

7. 圖片標(biāo)簽

概述:

使用img標(biāo)簽來(lái)向網(wǎng)頁(yè)中引入一個(gè)外部圖片

8.內(nèi)聯(lián)框架

概述:

使用內(nèi)聯(lián)框架可以引入一個(gè)外部的頁(yè)面,使用iframe來(lái)創(chuàng)建一個(gè)內(nèi)聯(lián)框架,但在現(xiàn)實(shí)開(kāi)發(fā)中不推薦使用內(nèi)聯(lián)框架,因?yàn)閮?nèi)聯(lián)框架中的內(nèi)容不會(huì)被搜索引擎檢索

使用屬性:

<iframe ></iframe>

src:指向一個(gè)外部界面的路徑,可以使用相對(duì)路徑

width:

將以上圖片提取文字并轉(zhuǎn)為markdown格式

使用屬性:

<iframe ></iframe>

src:指向一個(gè)外部界面的路徑,可以使用相對(duì)路徑

width:

height:

name:可以為內(nèi)聯(lián)框架指定一個(gè)name屬性

9. 超鏈接

概述:

使用超鏈接可以讓我們從一個(gè)界面跳轉(zhuǎn)到另一個(gè)界面

創(chuàng)建超鏈接:

使用a標(biāo)簽來(lái)創(chuàng)建一個(gè)超鏈接<a></a>

創(chuàng)建超鏈接時(shí),如果地址不確定可以直接寫(xiě)一個(gè)#作為占位符

屬性:

href:指向鏈接跳轉(zhuǎn)的目標(biāo)地址,可以寫(xiě)一個(gè)相對(duì)路徑也可以寫(xiě)一個(gè)完整的地址

target:a標(biāo)簽中的target屬性可以用來(lái)指定打開(kāi)鏈接的位置

可選值:_self,表示在當(dāng)前窗口打開(kāi)(默認(rèn)值)

_blank,表示在新的窗口打開(kāi)鏈接

可以設(shè)置一個(gè)內(nèi)聯(lián)框架的name屬性值,連接將會(huì)在指定的內(nèi)聯(lián)框架中打開(kāi)

center標(biāo)簽中的內(nèi)容會(huì)默認(rèn)在頁(yè)面中居中顯示

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 第1章 html基本結(jié)構(gòu) 認(rèn)識(shí)HTML: html不是一種編程語(yǔ)言,是一種標(biāo)志語(yǔ)言 標(biāo)記語(yǔ)言是由一套標(biāo)識(shí)標(biāo)簽組成的...
    不喝可樂(lè)_7889閱讀 735評(píng)論 0 0
  • 塊級(jí)元素和內(nèi)聯(lián)元素 在HTML中有兩種你需要知道的重要元素類別,塊級(jí)元素和內(nèi)聯(lián)元素。 塊級(jí)元素在頁(yè)面中以塊的形式展...
    MajorDong閱讀 1,883評(píng)論 0 0
  • 1、CSS筆記: 點(diǎn)擊鏈接后退頁(yè)面: 回到上一個(gè)網(wǎng)頁(yè) ——修改placeholder提示的樣式: 1.除IE外通用...
    倚劍闖天涯_閱讀 903評(píng)論 1 2
  • HTML 指超文本標(biāo)記語(yǔ)言(HyperText Markup Language),是一種用于創(chuàng)建網(wǎng)頁(yè)的標(biāo)準(zhǔn)標(biāo)記語(yǔ)言...
    神齊閱讀 2,139評(píng)論 0 3
  • 本文為閱讀《Head First HTML 與 CSS》的html部分的讀書(shū)筆記,方便回顧書(shū)上的知識(shí),另一篇為He...
    兼續(xù)閱讀 3,462評(píng)論 0 23

友情鏈接更多精彩內(nèi)容