柚子快報(bào)激活碼778899分享：HTML5學(xué)習(xí)筆記

http://yzkb.51969.com/

HTML學(xué)習(xí)筆記

1. 初識(shí)HTML

HTML的基本概況

HTML 負(fù)責(zé)網(wǎng)頁的結(jié)構(gòu)

css 負(fù)責(zé)網(wǎng)頁的樣式

JavaScript 負(fù)責(zé)網(wǎng)頁交互

HTML是一種建立網(wǎng)頁文件的語言，通過標(biāo)記式的指令 (Tag)，將文字，圖形、動(dòng)畫、聲音、表格、鏈接、影像等內(nèi)容顯示出來。 事實(shí)上，每一個(gè)HTML文檔都是一種靜態(tài)的網(wǎng)頁文件，這個(gè)文件里面包含了HTML 指令代碼 ，這些指令代碼并不是一種 程序語言 ，只是一種排版網(wǎng)頁中資料顯示位置的標(biāo)記結(jié)構(gòu)語言，易學(xué)易懂，非常簡單。

注意：

1.html不是編程語言，因?yàn)閔tml不具備任何邏輯

2.任意一個(gè)編輯器都可以寫html代碼

HTML5基本信息

在HTML中標(biāo)簽被分為雙標(biāo)簽和單標(biāo)簽 雙標(biāo)簽： 例如 body,body 單標(biāo)簽（空標(biāo)簽）： 例如 img,hr

HTML基本骨架

DOCTYPE標(biāo)簽:是告訴瀏覽器，我們要使用什么規(guī)范 html標(biāo)簽：表示該文件是以超文本標(biāo)記語言（HTML）編寫的 head標(biāo)簽：代表網(wǎng)頁的頭部 meta標(biāo)簽：描述形標(biāo)簽，它用來描述我們網(wǎng)站的一些信息 title標(biāo)簽: 代表網(wǎng)頁的標(biāo)題 body標(biāo)簽: 代表網(wǎng)頁的主體內(nèi)容。

2. 基本標(biāo)簽

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

一級(jí)標(biāo)簽

二級(jí)標(biāo)簽

三級(jí)標(biāo)簽

四級(jí)標(biāo)簽

五級(jí)標(biāo)簽

六級(jí)標(biāo)簽

段落標(biāo)簽

跑得快 跑得快

一只沒有耳朵 一只沒有尾巴

真奇怪 真奇怪

兩只老虎 兩只老虎

跑得快 跑得快

一只沒有耳朵 一只沒有尾巴

真奇怪 真奇怪

換行標(biāo)簽

跑得快 跑得快

一只沒有耳朵 一只沒有尾巴

真奇怪 真奇怪

兩只老虎 兩只老虎

跑得快 跑得快

一只沒有耳朵 一只沒有尾巴

真奇怪 真奇怪

水平線標(biāo)簽

字體樣式標(biāo)簽

粗體：i love you

斜體：i love you

注釋和特殊符號(hào)標(biāo)簽

空格 

版權(quán)所有©

3.圖像標(biāo)簽

常見的圖像格式：jpg，gif，png，bmp

src圖片地址

相對(duì)地址，絕對(duì)地址

…/ --上一級(jí)目錄

4.鏈接標(biāo)簽

href:必填，表示要跳轉(zhuǎn)到哪個(gè)頁面

target鏈接在哪個(gè)窗口打開

_self :會(huì)在相同的框架或者窗口中打開鏈接。

_blank:在新標(biāo)簽中打開

_parent:會(huì)在父窗口或者包含來超鏈接引用的框架的框架集中打開鏈接

_top:會(huì)清除所有被包含的框架，并打開鏈接

鏈接文本或圖像

a標(biāo)簽

點(diǎn)擊我跳轉(zhuǎn)到頁面一

點(diǎn)擊我跳轉(zhuǎn)到百度

錨鏈接

1.需要一個(gè)錨標(biāo)記

2.跳轉(zhuǎn)到標(biāo)記

回到頂部

down

功能性鏈接

郵件鏈接：mailto

請(qǐng)聯(lián)系我

擴(kuò)展：塊元素和行內(nèi)元素

塊元素

? 1.無論內(nèi)容多少，該元素獨(dú)占一行

? 2.（p、h1-h6）

行內(nèi)元素

? 1.內(nèi)容撐開寬度，左右都是行內(nèi)元素的可以再排在一行

? 2.（a. strong .em…）

5. 列表

有序列表

1. java
2. python
3. 前端
4. C/c++

無序列表

• java
• python
• 前端
• C/c++

自定義列表

dl：標(biāo)簽

dt：列表

dd：列表選項(xiàng)

學(xué)科

java

python

C/c++

Linux

位置

北京

廣州

上海

深圳

6. 表格

表格table

行 tr row

列 td col

border邊框

7.媒體元素

音頻和視頻

src :資源路徑

controls：控制條

autoplay：自動(dòng)播放

8.頁面結(jié)構(gòu)

元素名描述header標(biāo)題頭部區(qū)域的內(nèi)容（用于頁面或者頁面中的一塊區(qū)域）footer標(biāo)記腳部區(qū)域的內(nèi)容sectionweb頁面中的一塊獨(dú)立區(qū)域article獨(dú)立的文章內(nèi)容aside相關(guān)內(nèi)容或者應(yīng)用（常用于側(cè)邊欄）nav導(dǎo)航類輔助內(nèi)容

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

src：地址

w-h：寬高

frameborder=“0” 無邊框

frameborder=“1” 有邊框

點(diǎn)擊跳轉(zhuǎn)

10.學(xué)習(xí)表單

表單form

action：表單提交的位置，可以是網(wǎng)站，也可以是一個(gè)請(qǐng)求處理地址

method：post，get 提交方式

? get方式提交:我們可以在url中看到我們提交的信息，不安全，高效

? post:比較安全，傳輸大文件，