HTML常用標簽

文檔元數據

元數據(Metadata)含有頁面的相關信息,包括樣式、腳本及數據,能幫助一些軟件 (如搜索引擎, 瀏覽器等等)更好地運用和渲染頁面。對于樣式和腳本的元數據,可以直接在網頁里定義,也可以鏈接到包含相關信息的外部文件。
<base>:指定文檔里所有相對 URLs 地址的基礎 URL
<head>:規定文檔相關的通用信息(元數據),包括文檔標題、樣式或腳本的鏈接或定義。
<title>:定義文檔的標題,顯示在瀏覽器的標題欄或標簽頁上。它只可以包含文本,若是包含有標簽,則包含的任何標簽都不會被解釋。
<link>:指定了外部資源與當前文檔的關系. 這個元素的使用方法包括為導航定義關系框架.這個元素經常用來鏈接css文件。
<meta>:表示那些不能由其它HTML元相關元素<head>,<base>,<link>,<title>或<stlye>之一表示的任何元數據信息.
<stlye>:規定元素的行內 CSS 樣式

標題 h1~h6

h1:最大標題
h4:中號標題
h6:最小號標題

文本突出:

mark:幾乎和內容無關,就是為了標示(匹配搜索項,拼寫錯誤等)
strong:表示強調標簽文本內容,不改變其含義
em:表示感情上的強調,增強了語氣

段落和塊:

p:語義化的段落標簽,用于文章分段,有默認的間距
div:普通的塊標簽,多用于布局,默認沒有邊距

換行和橫線:


:換行


:橫線

行內書寫:

<span>:組合行內元素,以便通過樣式來格式化它們

圖片:

img:圖片

屬性:
  • src:圖片地址
  • alt: 圖片因為網絡等原因未成功加載時候的顯示文案內容
  • width/height:可以是像素值或者相對于父容器的百分比,兩個屬性僅設置一個,另外一個值會按相應等比縮放

有序無序列表:

ol:有序列表

屬性:

  1. start:規定起始值,默認1
  2. type:1、A、a、I、i,默認是數字
  3. reversed:降序(h5新加)
ul:無序列表

屬性:type(不推薦使用,使用css)

  1. disc:實心原點
  2. square:方塊
  3. circle:空心圓圈
    注:ol和li(ul和li)總是要在一起使用,li用來標示每個元素,ol(ul)把它們歸為一組

鏈接:

a:超鏈接
例:
<a target="_blank" >百度</a>

屬性:

  1. target: 打開頁面方式
  2. href:鏈接要指向哪里
  3. _self: 默認,在當前選項卡打開,替換當前頁面
  4. _blank:新的選項卡打開
  5. _parent:在父框架中打開
  6. _top: 在最頂層打開
  7. framename

按鈕

<button>:按鈕

定義表格

table:定義表格
thead :標簽定義表格的表頭
caption:定義表格標題

table屬性:
border:邊框
cellpadding:td的內邊距
cellspacing:td的外邊距
width:table寬度
td屬性:
align:水平對其方式
valign:垂直對齊方式
width:寬度,默認自動分布

dl: 展示有標題和內容的自定義表格
dt :標題子標簽
iframe: 在當前頁面嵌入一個頁面
tr :代表表格的一行
th :代表表格第一行的列內容
td :代表表格的一列

全局屬性:

class:規定元素的一個或多個類名(引用樣式表中的類)
dir:規定元素中內容的文本方向
id:規定元素的唯一 id
lang :規定元素內容的語言
draggable:規定元素是否可拖動
title:規定有關元素的額外信息
translate:規定是否應該翻譯元素內容
accesskey:規定激活元素的快捷鍵
contenteditable:規定元素內容是否可編輯
data-*:自定義屬性
spellcheck:規定是否對元素進行拼寫和語法檢查
tabindex:規定元素的 tab 鍵次序
body:定義文檔的主體

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,622評論 6 544
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,716評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,746評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,991評論 1 318
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,706評論 6 413
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 56,036評論 1 329
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,029評論 3 450
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,203評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,725評論 1 336
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,451評論 3 361
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,677評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,161評論 5 365
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,857評論 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,266評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,606評論 1 295
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,407評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,643評論 2 380

推薦閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,784評論 1 92
  • HTML標簽解釋大全 一、HTML標記 標簽:!DOCTYPE 說明:指定了 HTML 文檔遵循的文檔類型定義(D...
    米塔塔閱讀 3,301評論 1 41
  • (一)常用標簽 divspanulolaimgformbuttoninputtableh1, h2, h3pree...
    07120665a058閱讀 553評論 3 4
  • 前言:HTML是用來描述網頁的一種語言 是一種超文本標記語言 1.行標題 格式: 行標題 注:標題(Heading...
    LBQ_DS閱讀 489評論 0 0
  • 一.<!DOCTYPE> 文檔聲明 格式:1.<!DOCTYPE> 聲明必須是 HTML 文檔的第一行,位于 標...
    饑人谷_劉沖閱讀 536評論 0 2