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

一、文本標(biāo)簽

成都創(chuàng)新互聯(lián)公司主營墾利網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,APP應(yīng)用開發(fā),墾利h5微信平臺小程序開發(fā)搭建,墾利網(wǎng)站營銷推廣歡迎墾利等地區(qū)企業(yè)咨詢

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

注意：

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

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

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

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

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

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

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

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

1.4 換行標(biāo)記：

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

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

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

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

語法：實體名稱;

二、列表標(biāo)記

2.1 無序列表

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

li項目一/li

li項目二/li

li項目三/li

......

/ul

注意： type表示了項目符號：

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

circle：空心圓

square：實心方塊

2.2 有序列表：

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

li項目一/li

li項目二/li

li項目三/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表示起始值,從第幾個數(shù)開始計算

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=”對齊方式” size=”水平線高度” width=”水平線寬度”

color=”水平線顏色”

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

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

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

絕對地址和相對地址

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

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

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

3.3 多媒體標(biāo)記

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

marquee..../marquee

marquee的屬性：

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

bgcolor:跑馬燈的背景顏色

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

scrolldelay:每次移動的延遲時間，單位毫秒

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

height、width

hspace:左右空白寬度

vspace:上下空白寬度

3.3.2 嵌入音樂文件

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

3.3.3 嵌入視頻文件

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

四、表格

4.1 表格基本語法：

table

tr

......

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

......

/tr

/table

注意：

table:聲明一個表格對象

tr:聲明一行

td:聲明一個單元格

4.2 表格的基本屬性

1.align 對齊方式：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：輸入的最大長度

5.2.2 select標(biāo)簽

select name=”” size=”” multiple

option value=”選項1” 選項1

.......

option value=”選項n” 選項n

/select

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

value ：初始值

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

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

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

size:表示長度

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

/textarea

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

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

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

wrap:virtual和phycal控制自動換行

html5文字自動換行怎么設(shè)置？

在編輯器里面一般都有，編輯這個選項，里面有自動換行選項，里面能選多少個字符自動換行。

1、文字會視容器的寬度自動換行。

2、一般都是用限制寬度來控制的，設(shè)置固定寬度，溢出為隱藏，這樣就可以達(dá)到自動換行的目的。

3、在table中加入style=＂table-layout:fixed;＂在td中加入style=＂word-break : break-all;overflow:hidden;＂。

4、正常文字的換行(亞洲文字和非亞洲文字)元素?fù)碛心J(rèn)的 white-space:normal ,當(dāng)定義的寬度之后自動換行。

html5文字自動換行怎么設(shè)置

1.你定死表格的寬度，即給表格一個寬度值(是數(shù)值，不是百分比)

2.強(qiáng)制不換行

div{

//white-space：不換行;normal 默認(rèn);nowrap強(qiáng)制在同一行內(nèi)顯示所有文本，直到文本結(jié)束或者遭遇 br 對象

white-space:nowrap; }

自動換行

div{

word-wrap: break-word;

//word-break設(shè)置強(qiáng)行換行;normal 亞洲語言和非亞洲語言的文本規(guī)則，允許在字內(nèi)換行

word-break: normal;

}

強(qiáng)制英文單詞斷行

div{

word-break:break-all;

}

3.總結(jié)了一下，只要在CSS中定義了如下句子，可保網(wǎng)頁不會再被撐開了。

table{table-layout: fixed;}

td(word-break: break-all; word-wrap:break-word;)

注釋一下：

1.第一條table{table-layout: fixed;}，此樣式可以讓表格中有!!!(感嘆號)之類的字符時自動換行。

2.td{word-break: break-all}，一般用這句這OK了，但在有些特殊情況下還是會撐開，因此需要再加上后面一句(word-wrap:break-word;)就可以解決。此樣式可以讓表格中的一些連續(xù)的英文單詞自動換行。

(1)語法：

word-break : normal | break-all | keep-all

參數(shù)：

normal : 　依照亞洲語言和非亞洲語言的文本規(guī)則，允許在字內(nèi)換行

break-all : 　該行為與亞洲語言的normal相同。也允許非亞洲語言文本行的任意字內(nèi)斷開。該值適合包含一些非亞洲文本的亞洲文本

keep-all : 　與所有非亞洲語言的normal相同。對于中文，韓文，日文，不允許字?jǐn)嚅_。適合包含少量亞洲文本的非亞洲文本

(2)語法：

word-wrap : normal | break-word

參數(shù)：

normal : 　允許內(nèi)容頂開指定的容器邊界

break-word : 　內(nèi)容將在邊界內(nèi)換行。如果需要，詞內(nèi)換行(word-break)也行發(fā)生

說明：

設(shè)置或檢索當(dāng)當(dāng)前行超過指定容器的邊界時是否斷開轉(zhuǎn)行。

對應(yīng)的腳本特性為word-wrap。請參閱我編寫的其他書目。

(3)語法：

table-layout : auto | fixed

參數(shù)：

auto : 　默認(rèn)的自動算法。布局將基于各單元格的內(nèi)容。表格在每一單元格讀取計算之后才會顯示出來。速度很慢

fixed : 　固定布局的算法。在這算法中，水平布局是僅僅基于表格的寬度，表格邊框的寬度，單元格間距，列的寬度，而和表格內(nèi)容無關(guān)

說明：

如何讓表格自動換行?

設(shè)置或檢索表格的布局算法。

對應(yīng)的腳本特性為tableLayout。

4.按照網(wǎng)上大多數(shù)文章的說法，只要在CSS中加入：

代碼

..........

Code:

table {

table-layout:fixed;word-break:break-all;word-wrap:break-word;}

div{word-break:break-all;word-wrap:break-word;}

就可以解決表格和層被撐破，最初我也是這樣做的。不過這樣的代碼會造成一個問題，你會發(fā)現(xiàn)英文詞全部被截斷了，這不符合英語的書寫習(xí)慣也不利于閱讀。

后來我發(fā)現(xiàn)上述代碼改寫一下就可以做到既防止表格/層撐破又防止單詞斷裂了。

如下：

代碼

Code:

table {

table-layout: fixed;

word-wrap:break-word;

}

div {

word-wrap:break-word;

}

HTML如何換行

需要準(zhǔn)備的材料分別有：電腦、瀏覽器、html編輯器。

1、首先，打開html編輯器，新建html文件，例如：index.html，編寫問題基礎(chǔ)代碼。

2、在index.html中的body標(biāo)簽中，將外層的table改為div，新增css代碼：div {width: 300px;} table {float: left;}。

3、瀏覽器運(yùn)行index.html頁面，此時表格們實現(xiàn)了每3個自動換行。

網(wǎng)頁題目：html5換行,html5換行標(biāo)記,橫線標(biāo)記
文章路徑：http://chinadenli.net/article20/dsepgco.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供自適應(yīng)網(wǎng)站、網(wǎng)站收錄、商城網(wǎng)站、關(guān)鍵詞優(yōu)化、網(wǎng)站設(shè)計、建站公司

廣告

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