html的基礎知識

文檔的基本結構

題目

一級標題

腦圖

html_基礎的結構

常見元素

結構類

定義了文檔的框架結構

塊級元素，標題，1-6 字體逐漸減小

塊級元素，組織文本的段落

塊級元素其他元素的容器，常用來主旨章節；結合CSS設置樣式；及文檔布局

內聯元素，文本容器，結合CSS設置樣式

將頁面分欄顯示不同的html文版

內連框架

• Coffee
• Milk

無序列表

Coffee

Milk

有序列表Coffee

Black hot drink

Milk

White cold drink

自定義列表，dt為標題，dd為注釋

其中

內容類

標簽代表一類的特殊內容

超鏈接

定義縮寫，WHO

定義首字母縮寫

地址塊引用插入前后換行的外邊距

定義引用和引證,

The Scream by Edward Munch. Painted in 1893.

 圖片

短引用，內容加引號

計算機相關的內容類

定義計算機代碼。

適合定義計算機代碼。

定義鍵盤輸入。

定義計算機代碼樣本。

定義打字機代碼。

元素定義數學變量：

定義預格式文本。 不贊成使用。使用 代替。

不贊成使用。使用

代替。 不贊成使用。使用 代替。

修飾形容類

對內容或者格式起修飾和形容

---

橫線

刪除線

下劃線

換行

預格式文本，保留格式，適合代碼塊

文本樣式修飾類

定義文字方向 This text will be written from right to left

定義粗體文本。

定義大號字。

定義著重文字。

定義斜體字。

定義小號字。

定義加重語氣。

_{定義下標字。}

^{定義上標字。}

定義插入字。

定義刪除字。

不贊成使用。使用 代替。

不贊成使用。使用 代替。

不贊成使用。使用樣式(style)代替。

塊級元素內聯元素及嵌套

塊級元素用來搭建網站架構、布局、承載內容，包括 div、ul、li、dl、dt、dd、h1~h6、p、address, etc

內嵌元素 一般用在網站內容之中的某些細節或部位的定義與修飾，用以“強調、區分樣式、上標、下標、錨點”等等，包括 a, sapn, strong, sub, sup, img, etc

塊元素和內嵌元素是可以相互轉換的，如 display: block; /* 轉成塊元素 */,display: inline; /* 轉成內嵌元素 */

塊級元素是盒子，不管里面有多少東西，外部可以設置其寬高; 內嵌元素是袋子其寬高由內部的東西撐起來。

嵌套規則

塊元素可以包含內聯元素或某些塊元素，但內聯元素卻不能包含塊元素，它只能包含其它的內聯元素

塊級元素不能放在

里面

h1-6、p、dt 只能包含只能包含內嵌元素，不能再包含塊級元素

li 內可以包含 div 標簽，li 和 div 標簽都是裝載內容的容器，地位平等，沒有級別之分

塊級元素與塊級元素并列、內嵌元素與內嵌元素并列

標簽不能包含,, —— 對

元素細節

超鏈

超鏈接可以文字或者圖像，通過使用 href 屬性 創建指向另一個文檔的鏈接，通過使用 name 屬性 創建文檔內的書簽

指向郵箱的鏈接，發送郵件！

無下劃線的超鏈，

圖片作為超鏈， 

target = "_blank" or "showframe" or none指定打開文檔的顯示位置為 新窗口 或 框架 或 當前頁面

target = "iframe_name" 顯示到指定的 iframe,

W3School.com.cn

跳轉當頁面制定的錨點，制作目錄 ,基本的注意事項 - 有用的提示 --創建錨點-- 有用的提示，--本文檔中跳轉到書簽-- 有用的提示--UML中添加直接跳轉--

圖片

URL 可以是相對路徑和絕對路徑 ，

alt 替換文本，指定圖片顯示失敗時的替換文本，

嵌入圖片與文字的豎直方向的對齊方式， middle top;水平方向的位置，

指定圖片的大小 

圖片的邊框 border="0"

帶有可點擊區域的圖像映射

area 元素永遠嵌套在 map 元素內部。area 元素可定義圖像映射中的區域

中的 usemap 屬性可引用 中的 id 或 name 屬性(取決于瀏覽器)，所以我們應同時向 添加 id 和 name 屬性。


列表

無序列表

基本用例

CoffeeMilk

項目符號

有序列表

基本用例

CoffeeMilk

項目編號

, 或 “a”, “I”, “i”

自定義列表

基本用例

Coffee Black hot drink MilkWhite cold drink

通用屬性

元素的通用屬性 - accesskey, style, class, title, tabindex, id, dir, spellcheck, hidden, contenteditable, contextmenu, draggable, dropzone

accesskey 定義快捷鍵

webabcd blog

webabcd blog

style 定義樣式

webabcd

class 指定需要應用的 css 類選擇器

class

.myClass { font-size:36px; }

.myClass2 { color:Blue; }

webabcd

title 描述文檔信息

webabcd blog


id 用于定義元素的唯一標識，主要給 DOM 用，

id與name的區別

W3C 文檔對象模型 (DOM) 是中立于平臺和語言的接口，它允許程序和腳本動態地訪問和更新文檔的內容、結構和樣式。

webabcd blog

dir 文本排列方向，可能的值有：auto|ltr|rtl

123

spellcheck - 是否使用瀏覽器的拼寫檢查功能對元素內的內容做拼寫檢查

hidden - 用于隱藏元素

contenteditable - 用于定義內容是否可編輯

ontextmenu - 指定上下文菜單的數據源

draggable - 元素是否可拖拽；dropzone - 拖放的目標元素

腳本

標簽提供無法使用腳本時的替代內容，比方在瀏覽器禁用腳本時，或瀏覽器不支持客戶端腳本時。

如果瀏覽器壓根沒法識別

待深入

附錄

meta 中定義類型、編碼、作者、時間、編輯器、重定向

類型和編碼格式

作者

審核

編輯軟件

重定向

針對搜索引擎的，一些搜索引擎會利用 meta 元素的 name 和 content 屬性來索引您的頁面

關鍵字

描述

URL統一資源定位符

統一資源定位器(URL)用于定位萬維網上的文檔(或其他數據),樣式為 scheme://host.domain:port/path/filename

scheme包含 http(超文本傳輸協議), 以 http:// 開頭的普通網頁。不加密; https(安全超文本傳輸協議) 安全網頁。加密所有信息交換; ftp(文件傳輸協議)用于將文件下載或上傳至網站; file 瀏覽本地計算機上的文件。

編碼; URL 只能使用 ASCII 字符集來通過因特網進行發送, 使用 "%" 其后跟隨兩位的十六進制數來替換非 ASCII 字符, + 來替換空格

字符實體

某些符號是預留的，如果需要顯示采用字符實體，&entity_name; 或 entity_name;

空格 ? ?

< 小于號 < <

> 大于號 > >

& 和號 & &

" 引號 " "

' 撇號 ' (IE不支持) '

￠ 分(cent) ￠ ￠

￡ 鎊(pound) ￡ ￡

￥ 元(yen) ￥ ￥

€ 歐元(euro) € €

§ 小節 § §

? 版權(copyright)? ?

? 注冊商標 ? ?

? 商標 ? ?

× 乘號 × ×

÷ 除號 ÷ ÷

顏色

查詢手冊

總結

以上是生活随笔為你收集整理的阅读与html阅读的区别,w3c School读书笔记（一）：HTML基础的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。