您好,登錄后才能下訂單哦!
這篇文章主要介紹了html中常用標簽有哪些,具有一定借鑒價值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
1.1 標簽的分類
1.1.1 按主體分類:
1.帶主體的標簽:如<font>數據 </font>
2.不帶主體的標簽:如<br/> 換行標簽
判斷一個表是否需要帶主體,你可以思考該標簽是否需要封裝數據,如果需要封裝數據,那么該標簽必定帶主體,如果不需要封裝數據,那么就不需要帶主體。
2.1.2 按行分類:
1.如果一個標簽的內容需要獨立占一行,我們稱作為塊標簽。 比如:<h2>標題標簽
2.如果一個標簽不需要獨立占一行,我們稱作為內聯標簽。比如:<font>字體標簽
2.2 文本標簽:
標簽名 | 標簽描述 | 常用屬性 |
h2~h7 | 標題標簽,所有標題都是加粗的,1表示1級標題,字最大,6級標題最小 |
屬性是在開始標簽里面的 align:設置標題對齊方式 center:居中、right:右對齊、left:左對齊 |
hr | 畫一條水平線 | width:線長度 size: 粗細 color:顏色 |
b | 對字體加粗,與strong標簽功能相同 | |
i | 設置字體為斜體 | |
br |
換行 |
|
font | 字體(在HTML5中已經淘汰了) | color:顏色 size:大小 face:指定字體的名字 |
p | 分段,每個p標簽就是一個段落,沒有首行縮進。段落之間有間隔 |
如果要縮進,使用 ;半角空格也可全角空格 title:鼠標移上去以后,顯示文字提示信息 |
2.3 塊標簽與內聯標簽:
1.div:塊標簽,需要獨立占一行。
2.span:內聯標簽,不需要獨立占一行。
案例文字素材
World Wide Web Consortium</p>萬維網聯盟創建于1994年
代碼演示
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"></style> <script type="text/javascript"></script> </head> <body> <div style="background-color: red">World Wide Web Consortium</div> 萬維網聯盟創建于1994年 <span style="background-color: aqua">World Wide Web Consortium</span> 萬維網聯盟創建于1994年 </body> </html>
2.4 列表標簽:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"></style> <script type="text/javascript"></script> </head> <body> 今天早上吃什么? <ol style="color: black" type="A"> <li> 油條 </li> <li> 豆漿 </li> <li> 稀飯 </li> </ol> 明天早上吃什么? <ul style="color: black" type="disc"> <li>面</li> <li>糯米雞</li> </ul> </body> </html>
2.5 實體字符
2.5.1 為什么需要使用到實體字符:
在HTML頁面中,有些字符是有著特殊含義的字符,如果需要在網頁上顯示這種特殊的字符,那么就需要使用到該特殊字符對應的實體字符。比如:< 小于號 > 大于號
2.5.2 實體字符列表:
注釋:實體名稱對大小寫敏感!
2.5.3 常用的實體字符:
特殊的字符 | 對應的實體字符 |
< | < |
> | > |
空格 | |
¥ |
¥ |
? 版本所有 | © |
? | ® |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"></style> <script type="text/javascript"></script> </head> <body> <h2>標簽是標題標簽<br/> 百度(納斯達克:BIDU),全球最大的中文搜索引擎、最大的中文網站。 1999年底,身在美國硅谷的李彥宏看到了中國互聯網及中文搜索引擎服務的巨大發展潛力, 抱著技術改變世界的夢想,他毅然辭掉硅谷的高薪工作,攜搜索引擎專利技術,于 2000年1月1日在中關村創建了百度公司。<br/> 青島啤酒:¥16元一瓶。<br/> 《java從入門到放棄》:© XXX版權所有<br/> 本次活動解釋權歸XXX公司所有:®XXX有限公司 </body> </html>
2.6 圖像標簽(img)
2.6.1 標簽的作用:
在網頁中顯示圖片。
2.6.2 常用的屬性:
屬性名 | 作用 |
src | source圖片文件地址,注:不能使用客戶端本地地址,如:c:/aaa.jpg |
width | 圖片寬度,如果只指定寬和高,另一個參數會等比例縮放 |
height | 圖片高度 |
alt | 如果圖片丟失,圖片顯示的文字 |
title | 如果鼠標移到圖片上,顯示提示文字信息 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"></style> <script type="text/javascript"></script> </head> <body> <img src="img/11.jpg" height="500" width="200" title="這個是一輛豪車" /> </body> </html>
感謝你能夠認真閱讀完這篇文章,希望小編分享html中常用標簽有哪些內容對大家有幫助,同時也希望大家多多支持億速云,關注億速云行業資訊頻道,遇到問題就找億速云,詳細的解決方法等著你來學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。