HTML+CSS基礎學習-認識標簽

div

<div> 可定義文檔中的分區(qū)或節(jié)(division/section)。
<div> 標簽可以把文檔分割為獨立的屑宠、不同的部分厢洞。它可以用作嚴格的組織工具,并且不使用任何格式與其關聯(lián)典奉。
如果用 id 或 class 來標記 <div>躺翻,那么該標簽的作用會變得更加有效。

div標簽中內容相當于一個獨立的邏輯部分秋柄,屬于塊級元素获枝。

table

<table> 標簽定義 HTML 表格。
簡單的 HTML 表格由 table 元素以及一個或多個 tr骇笔、th 或 td 元素組成省店。
tr 元素定義表格行,th 元素定義表頭笨触,td 元素定義表格單元懦傍。
更復雜的 HTML 表格也可能包括 caption、col芦劣、colgroup粗俱、thead、tfoot 以及 tbody 元素虚吟。

  • <table> 相當于整個表格的根標簽
  • <caption> 表格標題寸认,必須緊跟table開始標簽之后
  • <thead> 表頭內容
  • <tbody> 表格主體签财,用于組合HTML表格的主體內容,應與<thead><tfoot>結合起來使用
  • <tfoot> 表注(頁腳)內容
  • <tr> 表格的一行
  • <td> 標準單元格
  • <th> 表頭單元格

thead偏塞、tbody唱蒸、tfoot標簽使用的話必須全部使用,并且出現(xiàn)的次序是:thead灸叼、tbody神汹、tfoot,在table內部使用古今。

a

<a href="鏈接" title="標題" target="方式" ></a>

<a>標簽定義超鏈接屁魏,用于從一個頁面跳到另一個頁面,跳到的頁面由屬性href設定捉腥,重要屬性還有target設置何處打開鏈接文檔氓拼,如_self當前頁面打開,_blank新頁面打開但狭,title文本內容披诗,用于描述鏈接地址的內容,鼠標停留在鏈接文字上時立磁,會顯示該文本內容呈队,實際網(wǎng)頁開發(fā)中作用很大,方便搜索引擎了解所鏈接地址的內容唱歧,語義化更友好宪摧。另外還可以鏈接Email地址,使用mailto颅崩,詳細如圖:

`<a>`標簽mailto詳細用法<br>圖片來源:慕課網(wǎng)
`<a>`標簽mailto詳細用法<br>圖片來源:慕課網(wǎng)

img

<img src="圖像地址" alt="替代描述文字" title="圖像描述文字" />

圖片標簽几于,使用<img>向網(wǎng)頁中插入圖片。主要屬性有:

  • src 標識圖像的位置
  • alt 圖像的描述性文本沿后,當圖片不可見時沿彭,將顯示該文本
  • title 圖像的描述,當鼠標停留圖像上是顯示

form

<form action="提交的地址" method="提交方式">
...
</form>

<form>標簽用于為用戶輸入創(chuàng)建 HTML 表單尖滚,用于向服務器傳輸數(shù)據(jù)喉刘。主要屬性:

  • action 數(shù)據(jù)將被傳送的地方,一個服務端地址漆弄。
  • method 數(shù)據(jù)傳輸?shù)姆绞侥郎眩諫ET和POST。

表單的所有控件必須放在<form></form>標簽之間撼唾,常用控件有文本框廉邑、文本域、單選框、復選框等蛛蒙。

input

主要屬性:

  • type 指定input框類型糙箍。
    type="text" --> 文本輸入框
    type="password" --> 密碼輸入框
    type="radio" --> 單選框
    type="checkbox" --> 復選框
    type="submit" --> 提交按鈕,提交表單信息
    type="reset" --> 重置按鈕牵祟,重置表單信息到初始時的狀態(tài)

  • name 為文本框命名倍靡,備后臺程序使用。

  • value 設置默認值

當type為radio/checkbox時课舍,可設置checked屬性,控制是否默認選中他挎。同一組單選按鈕筝尾,name取值一定要一致。

textarea

文本域办桨,多行文本輸入筹淫。語法:

<textarea name="名稱" row="行數(shù)" cols="列數(shù)">文本...</textarea>

select

<select>
    <option value="提交值">選項</option>
    <option value="提交值2" selected="selected">選項2</option>
    ...
</select>

下拉列表選擇框,selected="selected"設置默認選中呢撞。在select標簽中設置multiple="multiple"屬性损姜,可實現(xiàn)多選功能,但基本上沒人使用殊霞。

label

<form>
  <label for="male">Male</label>
  <input type="radio" name="sex" id="male" />
  <br />
  <label for="female">Female</label>
  <input type="radio" name="sex" id="female" />
</form>

<label> 標簽為 input 元素定義標注(標記).
label 元素不會向用戶呈現(xiàn)任何特殊效果摧阅。不過,它為鼠標用戶改進了可用性绷蹲。如果您在 label 元素內點擊文本棒卷,就會觸發(fā)此控件。就是說祝钢,當用戶選擇該標簽時比规,瀏覽器就會自動將焦點轉到和標簽相關的表單控件上。
<label> 標簽的 for 屬性應當與相關元素的 id 屬性相同拦英。

其他

  • <p> 文章的段落蜒什,一個p標簽就是一個段落。
  • <hx> 文章的標題疤估,h1~6六個灾常,分別為一到六級標題,并且重要性遞減做裙。
  • <em> 表示強調語氣岗憋,瀏覽器中默認斜體樣式。
  • <strong> 表示強調語氣锚贱,比em更強烈仔戈,瀏覽器默認粗體樣式顯示。
  • <span> 沒有語義
  • <q> 短文本引用
  • <blockquote> 長文本引用
  • <br> 換行
  • <hr> 用于分隔的水平橫線
  • <address> 地址信息
  • <code> 行級代碼
  • <pre> 段級代碼
  • <ul>/<li> 無序列表
  • <ol>/<li> 有序列表
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市监徘,隨后出現(xiàn)的幾起案子晋修,更是在濱河造成了極大的恐慌,老刑警劉巖凰盔,帶你破解...
    沈念sama閱讀 207,113評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件墓卦,死亡現(xiàn)場離奇詭異,居然都是意外死亡户敬,警方通過查閱死者的電腦和手機落剪,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,644評論 2 381
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來尿庐,“玉大人忠怖,你說我怎么就攤上這事〕” “怎么了凡泣?”我有些...
    開封第一講書人閱讀 153,340評論 0 344
  • 文/不壞的土叔 我叫張陵,是天一觀的道長皮假。 經常有香客問我鞋拟,道長,這世上最難降的妖魔是什么惹资? 我笑而不...
    開封第一講書人閱讀 55,449評論 1 279
  • 正文 為了忘掉前任贺纲,我火速辦了婚禮,結果婚禮上褪测,老公的妹妹穿的比我還像新娘哮笆。我一直安慰自己,他們只是感情好汰扭,可當我...
    茶點故事閱讀 64,445評論 5 374
  • 文/花漫 我一把揭開白布稠肘。 她就那樣靜靜地躺著,像睡著了一般萝毛。 火紅的嫁衣襯著肌膚如雪项阴。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,166評論 1 284
  • 那天笆包,我揣著相機與錄音环揽,去河邊找鬼。 笑死庵佣,一個胖子當著我的面吹牛歉胶,可吹牛的內容都是我干的。 我是一名探鬼主播巴粪,決...
    沈念sama閱讀 38,442評論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼通今,長吁一口氣:“原來是場噩夢啊……” “哼粥谬!你這毒婦竟也來了?” 一聲冷哼從身側響起辫塌,我...
    開封第一講書人閱讀 37,105評論 0 261
  • 序言:老撾萬榮一對情侶失蹤漏策,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后臼氨,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體掺喻,經...
    沈念sama閱讀 43,601評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,066評論 2 325
  • 正文 我和宋清朗相戀三年储矩,在試婚紗的時候發(fā)現(xiàn)自己被綠了感耙。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,161評論 1 334
  • 序言:一個原本活蹦亂跳的男人離奇死亡持隧,死狀恐怖抑月,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情舆蝴,我是刑警寧澤,帶...
    沈念sama閱讀 33,792評論 4 323
  • 正文 年R本政府宣布题诵,位于F島的核電站洁仗,受9級特大地震影響,放射性物質發(fā)生泄漏性锭。R本人自食惡果不足惜赠潦,卻給世界環(huán)境...
    茶點故事閱讀 39,351評論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望草冈。 院中可真熱鬧她奥,春花似錦、人聲如沸怎棱。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,352評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽拳恋。三九已至凡资,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間谬运,已是汗流浹背隙赁。 一陣腳步聲響...
    開封第一講書人閱讀 31,584評論 1 261
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留梆暖,地道東北人伞访。 一個月前我還...
    沈念sama閱讀 45,618評論 2 355
  • 正文 我出身青樓,卻偏偏與公主長得像轰驳,于是被迫代替她去往敵國和親厚掷。 傳聞我的和親對象是個殘疾皇子弟灼,可洞房花燭夜當晚...
    茶點故事閱讀 42,916評論 2 344

推薦閱讀更多精彩內容

  • HTML標簽解釋大全 一、HTML標記 標簽:!DOCTYPE 說明:指定了 HTML 文檔遵循的文檔類型定義(D...
    米塔塔閱讀 3,225評論 1 41
  • img標簽: img標簽中的img其實是英文image的縮寫,所以img標簽的作用, 就是告訴瀏覽器我們需要顯示一...
    佩佩216閱讀 1,468評論 0 2
  • HTML基礎 本文包括 HTML基本知識與結構 HTML常見標簽 標簽寫法與嵌套的討論 HTML蝗肪、CSS袜爪、java...
    廖少少閱讀 2,078評論 2 21
  • HTML5 標簽comment 注釋標簽用于在源文檔中插入注釋。注釋內容不會被瀏覽器顯示薛闪。為代碼編寫注釋的好處是...
    才気莮孒閱讀 4,045評論 1 25
  • 1辛馆、HTML介紹 1 2、Html和CSS的關系 HTML是網(wǎng)頁內容的載體。內容就是網(wǎng)頁制作者放在頁面上想要讓用戶...
    夏沫xx閱讀 1,358評論 0 8