html5常用標(biāo)記總結(jié)

一、文本標(biāo)簽

成都創(chuàng)新互聯(lián)公司專業(yè)為企業(yè)提供神池網(wǎng)站建設(shè)、神池做網(wǎng)站、神池網(wǎng)站設(shè)計(jì)、神池網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁(yè)設(shè)計(jì)與制作、神池企業(yè)網(wǎng)站模板建站服務(wù)，十載神池做網(wǎng)站經(jīng)驗(yàn)，不只是建網(wǎng)站，更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。

1.1 標(biāo)題標(biāo)記：hn align=”對(duì)齊方式”標(biāo)題文本/hn

注意：

1.標(biāo)題準(zhǔn)備了h1----h6的標(biāo)題，按照字號(hào)依次遞減(塊級(jí)元素)

2.align表示對(duì)齊方式，其值為left,center,right

1.2 字體標(biāo)記：font face=”字體名稱” size=”字號(hào)” color=”字體顏色” 文字/font

注意：中文網(wǎng)頁(yè)以黑體，宋體，3號(hào)字的效果顯示

1.3 段落標(biāo)記：p align=”對(duì)齊方式” 段落內(nèi)容/p

注意：p可以作為單標(biāo)記或雙標(biāo)記：

單標(biāo)記：段落與上文產(chǎn)生一個(gè)空行的間距。

雙標(biāo)記：段落與上下文之間產(chǎn)生一個(gè)空行的間距

1.4 換行標(biāo)記：

注意：br /表示換行，多次換行多次使用br /

1.5 預(yù)格式化標(biāo)記：pre...../pre

注意：預(yù)格式化標(biāo)記可將空格、制表符、回車符等忽略

1.6 轉(zhuǎn)義字符：轉(zhuǎn)義字符讓特殊字符顯示出來(lái)。

語(yǔ)法：實(shí)體名稱;

二、列表標(biāo)記

2.1 無(wú)序列表

ul type=”列表項(xiàng)的標(biāo)簽符”

li項(xiàng)目一/li

li項(xiàng)目二/li

li項(xiàng)目三/li

......

/ul

注意： type表示了項(xiàng)目符號(hào)：

disc(默認(rèn)) 實(shí)心圓

circle：空心圓

square：實(shí)心方塊

2.2 有序列表：

ol type=”列表項(xiàng)的標(biāo)記符” start=”起始值”

li項(xiàng)目一/li

li項(xiàng)目二/li

li項(xiàng)目三/li

......

/ol

注意：1. 1:1,2,3,.......

a:a,b,c,d,e.......

A:A,B,C,D,E.......

i:i,ii,iii,iv......

I:I,II,III,IV......

2.start表示起始值,從第幾個(gè)數(shù)開始計(jì)算

2.3 嵌套排列

ol type="1"

lih/li

lit/li

ul type="disc"

lim/li

lil/li

/ul

li5/li

/ol

2.4 分割線標(biāo)記：hr align=”對(duì)齊方式” size=”水平線高度” width=”水平線寬度”

color=”水平線顏色”

三、超鏈接標(biāo)記

3.1 文本鏈接：a href=”目標(biāo)URL” target=”目標(biāo)窗口”指針文本/a

注意： 1.href表示文本鏈接的目標(biāo)資源的URL

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

絕對(duì)地址：在任何情況下都可以找到的地址（例如：網(wǎng)址）

相對(duì)地址：必須知道當(dāng)前所在，才能找到（../表示上一級(jí)目錄，/表示下級(jí)目錄）例子：../img/baidu.jpg 表示在當(dāng)前位置的上一層目錄下的img文件夾中的baidu.jpg 文件。

3.2 圖片標(biāo)記：img src=”圖片文件路徑” alt=”提示文本” height=”圖片高度” width=”圖片寬度”/

3.3 多媒體標(biāo)記

3.3.1 滾動(dòng)字幕標(biāo)記：marquee可以實(shí)現(xiàn)文字或圖片的跑馬燈效果

marquee..../marquee

marquee的屬性：

behavior 指定了跑馬燈的效果：scroll(滾動(dòng))、slide(滑動(dòng))、alternate(交替)

bgcolor:跑馬燈的背景顏色

direction:跑馬燈的移動(dòng)方向，left（左）、right(右)、up(上)、down(下)

scrolldelay:每次移動(dòng)的延遲時(shí)間，單位毫秒

loop:跑馬燈運(yùn)行次數(shù)，-1表示無(wú)限循環(huán)

height、width

hspace:左右空白寬度

vspace:上下空白寬度

3.3.2 嵌入音樂文件

audio src=”文件地址” 提示文字/audio

3.3.3 嵌入視頻文件

video src=”視頻文件地址” controls=”controls”提示文字/video

四、表格

4.1 表格基本語(yǔ)法：

table

tr

......

td單元格內(nèi)容/td

......

/tr

/table

注意：

table:聲明一個(gè)表格對(duì)象

tr:聲明一行

td:聲明一個(gè)單元格

4.2 表格的基本屬性

1.align 對(duì)齊方式：left、center、right

2.border:表格邊框

3.bordercolor:邊框顏色

4.bgcolor:表格背景顏色

5.background:背景圖片

6.height、width

4.3 單元格合并

1.rowspan:所跨的行數(shù)

2.colspan:所跨的列數(shù)

五、表單

5.1 表單標(biāo)簽：form action=”URL” method=”get|post” target=”...”/form

注意：form：該標(biāo)記中包含的數(shù)據(jù)將被提交到服務(wù)器或者電子郵件中

action:指定服務(wù)器端處理提交表單信息的程序是什么。URL地址或電子郵件地址

method:get/post:數(shù)據(jù)傳輸?shù)椒?wù)器的傳遞方法

target:服務(wù)器返回文檔結(jié)果的顯示位置：_blank:在新的瀏覽器窗口中打開

_self:在當(dāng)前瀏覽器中顯示

5.2 表單標(biāo)記

5.2.1 input標(biāo)簽：input type=”類型” name=”服務(wù)器 獲取用戶輸入信息的名字” value=”初始值”

注意：1.type類型（輸入類型）:

1. text:單行文本框

2. password:密碼輸入框

3. radio:單選按鈕 checked表示默認(rèn)

4. checkbox:復(fù)選框 checked表示默認(rèn)

5. submit:提交按鈕

6. reset:重置按鈕

7. button:普通按鈕

2.maxlength：輸入的最大長(zhǎng)度

5.2.2 select標(biāo)簽

select name=”” size=”” multiple

option value=”選項(xiàng)1” 選項(xiàng)1

.......

option value=”選項(xiàng)n” 選項(xiàng)n

/select

注意：name:服務(wù)器 獲取用戶輸入信息的名字

value ：初始值

option：下拉框的內(nèi)容

multiple:多選，若沒有multiple則是單選

selected:表示默認(rèn)選項(xiàng)

size:表示長(zhǎng)度

5.2.3 textarea 標(biāo)簽：textarea name=”...” cols=”...” rows=”...” wrap=”off/virtual/physical”

/textarea

注意: name：多行文本框的名稱

cols：一行可容納的字符數(shù)

rows：表示可顯示額的行數(shù)

wrap:virtual和phycal控制自動(dòng)換行

html5語(yǔ)法

基本沿用了html基礎(chǔ)語(yǔ)法。但更簡(jiǎn)潔更人性化,主要有以下5點(diǎn)：

!doctype html

字符集設(shè)置

meta charset="utf-8"

不允許寫的結(jié)束符的標(biāo)簽： area、basebr、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr

可以省略結(jié)束符的標(biāo)簽： li、dt、dd、p、rt、optgroup、option、colgroup、thread、tbody、tr、td、th

新增結(jié)構(gòu)化標(biāo)簽 ：

? ? 從div...div/派生而出

(1)header標(biāo)簽 :顧名思義，header標(biāo)簽用于將 HTML 頁(yè)面的一部分標(biāo)記為頁(yè)眉。

(2)section標(biāo)簽 :section標(biāo)簽用于標(biāo)識(shí)頁(yè)面上的重要內(nèi)容部分。該標(biāo)簽有點(diǎn)類似于將一本書分成幾個(gè)章節(jié)。

(3)article標(biāo)簽 :article標(biāo)簽標(biāo)識(shí)了 Web 頁(yè)面中的主要內(nèi)容。以博客為例，每篇帖子都構(gòu)成一個(gè)重要內(nèi)容。

(4)aside標(biāo)簽 :aside標(biāo)簽表示標(biāo)簽中包含的內(nèi)容與頁(yè)面主要內(nèi)容相關(guān)，但不是該頁(yè)面的一部分。這有點(diǎn)類似于使用括弧對(duì)正文進(jìn)行注釋（就像這樣）。括弧中的內(nèi)容提供關(guān)于該元素的一些附加信息。

(5)footer標(biāo)簽 :footer標(biāo)簽將所包含的元素內(nèi)容標(biāo)記為文檔的頁(yè)腳。

( 6)nav標(biāo)簽 :nav標(biāo)簽中包含的內(nèi)容主要用于導(dǎo)航。

示例：

新增媒體標(biāo)簽：

video

audio

embed

input type="checkbox" checked/

寫明表示true；否則false

不區(qū)分大小寫，與xhtml不同

單雙引號(hào)皆可，有空格時(shí)不行。

html5中怎么用空格播放和暫停視頻

var isplay = true;//默認(rèn)是播放的

var video = document.getElementById("myVideo");

document.onkeyup=function(event){

var e = event || window.event || arguments.callee.caller.arguments[0];

if(e e.keyCode==8){ // 按 空格并讓它彈起

//要做的事情

if(isplay) {//判斷當(dāng)前播放狀態(tài)

isplay = false;

video.pause();

}else {

isplay = true;

video.play();

}

};

寫HTML代碼時(shí)，縮進(jìn)選用一個(gè)Tab鍵還是4個(gè)空格？

業(yè)內(nèi)有過縮進(jìn)選用Tab還是空格的爭(zhēng)論。在縮進(jìn)方面，Tab鍵和空格這兩種方法的特點(diǎn)并不相同。

1、??????? Tab鍵與空格縮進(jìn)的特點(diǎn)

Tab鍵：在書寫代碼時(shí)會(huì)很方便，但是在不同編輯器當(dāng)中，距離大小有可能不同。在編輯器當(dāng)中，一個(gè)Tab鍵的長(zhǎng)度大小存在一個(gè)默認(rèn)值，這個(gè)默認(rèn)值可以是兩個(gè)空格長(zhǎng)度，也可以是4個(gè)，還可以是8個(gè)。由于團(tuán)隊(duì)開發(fā)當(dāng)中，每個(gè)人的編輯器默認(rèn)情況下可能不一致，從而有可能造成A的代碼放到B的編輯器中時(shí)，縮進(jìn)的長(zhǎng)度發(fā)生變化。

4個(gè)空格：在每個(gè)編輯器中，空格大小一致，其不足之處在于：代碼書寫時(shí)會(huì)比較麻煩，需要按多次空格鍵。

2、??????? 如何選擇縮進(jìn)方式

其實(shí)并不需要糾結(jié)這個(gè)問題，各個(gè)編輯器都提供了“空格”和Tab鍵的相互轉(zhuǎn)換。因此，完全可以使用Tab鍵進(jìn)行書寫，在書寫完畢之后，將Tab鍵轉(zhuǎn)換為空格，之后生成最終文件即可。當(dāng)然，有些公司并不要求使用空格，那開發(fā)工程師就更方便了。

最終文件采用哪種方式，需要根據(jù)公司要求而定。如果公司沒有硬性要求，那么自己的代碼一定要保持一致性，不要出現(xiàn)“10個(gè)文件中，3個(gè)使用的是空格進(jìn)行縮進(jìn)，7個(gè)使用的是Tab鍵進(jìn)行縮進(jìn)”這種現(xiàn)象。

如圖所示，在Sublime編輯器中，可以進(jìn)行選項(xiàng)卡寬度的設(shè)定，也可以實(shí)現(xiàn)空格與Tab鍵的互相轉(zhuǎn)換。

資料來(lái)源：《HTML5布局之路》

html空格怎么寫

通常情況下，我們用空格鍵來(lái)打出多個(gè)空格，而在編寫代碼時(shí)，通過空格鍵、Tab鍵以及回車鍵打出的空格，都會(huì)被HTML（超文本標(biāo)記語(yǔ)言）自動(dòng)忽略。HTML將這樣的鍵視為空白字符，并顯示為單個(gè)空白間隔。盡管CSS提供了多種樣式的空格和縮進(jìn)，但是在HTML中也有一些工具可以讓你自己定義空格。

1、插入一個(gè)非間斷空格

一般來(lái)說，無(wú)論你按多少次空格鍵，HTML也只會(huì)在單詞之間顯示一個(gè)空白間隔。當(dāng)你需要插入多個(gè)空格時(shí)，請(qǐng)輸入nbsp;或#160;代碼。[1]?它們名為“空格占位符”，你輸入幾個(gè)，就能在頁(yè)面中顯示幾個(gè)空格。之所以稱之為非間斷空格，是因?yàn)檫@樣不會(huì)產(chǎn)生換行符。如果你濫用這種空格，瀏覽器可能無(wú)法以整齊易讀的方式插入換行符。

2、插入不同寬度的空格

有多種字符實(shí)體可以讓瀏覽器顯示空格。不同的瀏覽器在顯示方式上可能會(huì)有一點(diǎn)不同，但是和nbsp;不同，它們不會(huì)影響換行：

ensp;?— “en空格”是根據(jù)字體排印學(xué)的計(jì)量單位命名，寬度是兩個(gè)普通空格的寬度

emsp;?— “em空格”大概是四個(gè)普通空格的寬度

3、使用非間斷空格模擬制表符

生成段落的一種方式就是在第一行前插入幾個(gè)空格：nbsp;nbsp;nbsp;nbsp;。這個(gè)方法只適用于HTML，如果你使用CSS的話，不推薦這一方法（在其它步驟中會(huì)介紹別的方法）。如果段落的內(nèi)容是富文本，請(qǐng)使用“pre”標(biāo)簽。

4、使用CSS生成段落。

CSS的內(nèi)邊距或外邊距給瀏覽器指明了具體的顯示格式，所以顯示效果的一致性較高。即使你不是很了解CSS，手邊也沒有說明表，也可以很容易地添加。下面將具體說明如何將整個(gè)段落移到右邊：[5]

在HTML文檔的head/head部分，插入以下命令：

stylep.indent{ padding-left: 1.8em }/style

“p.indent”定義了一個(gè)叫“indent”（可以隨意命名）的段落（標(biāo)簽為p）。剩下的命令則是給段落左側(cè)添加內(nèi)邊距空格。

返回HTML文檔的主體。每當(dāng)你想添加段落時(shí)，在標(biāo)簽中插入以下內(nèi)容：

p class="indent"/p

要調(diào)整縮進(jìn)的數(shù)量，只需要更改CSS命令中的數(shù)字“1.8”即可。后面的“em”要保留，它是表示寬度的單位。

當(dāng)前題目：html5空格,html5空格字符
轉(zhuǎn)載源于：http://chinadenli.net/article42/dsggshc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供商城網(wǎng)站、定制開發(fā)、網(wǎng)站維護(hù)、響應(yīng)式網(wǎng)站、網(wǎng)站設(shè)計(jì)公司、電子商務(wù)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)