您好,登錄后才能下訂單哦!
這篇文章主要介紹“HTML標簽語法的知識點有哪些”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“HTML標簽語法的知識點有哪些”文章能幫助大家解決問題。
一、標簽語法
1、所有的標簽都必須使用尖括號擴起來,例如 <a>,<div> ... <A>,<a>
2、有封閉類型的標簽,也有非封閉類型的標簽
2.1、封閉類型,也稱作雙標記,則必須成對出現;語法規則: <標記>文本內容</標記>; 不同的標記,決定 了"文本內容"的不同表現形式;常見的封閉類型標記有:<a></a>,<p></p>,<div></div>
2.2、非封閉類型,也稱作單標記、空標記;語法規則: <標記>或者<標記/> 常見的非封閉類型標記有: <hr>,<br>,<img>
區別封閉類型和非封閉類型標簽,就看這標簽是一對出現的,還是單個出現的。
3、標簽嵌套
標簽之間可以相互嵌套,形成復雜的語法結構,簡單的例子如下:
<body>
<p>
<a></a>
</p>
</body>
4、標簽屬性,標簽屬性是指出現在開始標記中的內容,作用是修飾元素,如 <div 屬性名="屬性值"></div>
標準屬性:就是每個元素與生俱來就具備的通用屬性,常見的標準屬性有:
id :定義每個標簽的唯一標識
title:提示文本
class:樣式相關,類樣式
style:樣式相關,行內樣式
現在可以和小編一個編寫一個簡單的標簽,同時設置這個標簽的id屬性為myDIv。(屬性命名方式:駝峰命名,后續會分享給大家)
實戰:第一步:先定義一個標簽div,即<div></div>
第二步:添加id屬性,即<div id="myDIv"></div>
疑問:如果存在多個屬性值怎么辦?怎么添加屬性值是編碼規范的?
答:如果是多屬性的,那么直接在前一個屬性值后繼續編寫,不需要用“,”或者“;”分開,直接寫就對了!而且,多個屬性排名不分先后的,舉個栗子: <div id="myDiv" title="myTitle"></p>
二、文檔結構
1、文檔類型聲明:即聲明使用的HTML版本和風格,HTML5中使用聲明為: <!doctype html>
2、html頁面
2.1、文檔根元素,每個文檔有且僅有一對根元素 , html
2.2、在根元素的內部,包含兩對子元素;
2.2.1、head : 頁面的頭部內容,定義頁面全局信息 包含的內容有:
<title></title> ;網頁標題,就是網頁地址上面顯示的名稱;
<meta />:聲明元數據(編碼,關鍵字,描述),最重要的搜索引擎SEO主要是寫這部分;同時也可以定義一些網頁屬性,比如說,中文顯示 <meta charset="utf-8" />;
<style></style>:聲明內部樣式表,聲明當前網頁所用到的樣式,這種方式的樣式定義只能運用在當前頁面,其他頁面不能使用這里定義的樣式;
<link />:引入外部樣式表,引入外部定義好的樣式,只要是這個頁面想要用到某一個外部樣式表,就直接引入就可以用了,這種樣式表定義運用彌補上面<style></style>不能共享的缺陷,是的代碼達到了重用的優勢;
<script></script>:定義或引入腳本文件,主要是引入一些js腳本語言,完成這個頁面所需要的交互;
2.2.2、body : 頁面的主體內容,任何一個標簽,都可能會出現在body中;<body>也是標簽,它也可以定義自己的屬性,比如網頁背景有綠色,那么就是<body bgcolor="green"></body>;
3、文本標記
3.1、特殊的文本,除了正常文字外,在一些特定的情況下會需要有特別的標點符號等,小編舉例幾個常見的特殊符號的標記,如 空格對應的是“ ”、 <對應的是 “<” 可以理解為less than 、> 對應的是 “> ”理解為greater than、 版權標識對應的是 “©”,這里需要特別特別注意的一點是 每個特殊字符有需要“;”
3.2、文本標記
3.2.1、文本樣式
<b>...</b>: 加粗文本;
<i>...</i>:斜體文本;
<u>...</u>:下劃線;
<s>...</s>:刪除線;
<sup>...</sup>:上標;
<sub>...</sub>:下標;
3.2.2、標題元素, 1-6級6個標題 <hn></hn> n:1-6 其中一級是最大的, 六級是最小的;
3.2.3、段落元素,提供了結構化文本的表現方式, 語法:<p></p>, 注意:每對p標簽單獨成一個段落,常用屬性:
align:水平對齊方式 取值:left center right;
4、換行元素,在代碼的任何位置處,實現回車的效果 <br />,是非封閉類型標記;
5、水平線, 又叫分割線, <hr /> 也是非封閉類型標記,常用屬性;
5.1、size :水平線的粗細,通常以像素(px)為單位;
5.2、width:寬度;
5.3、align:水平線的水平對齊方式;
5.4、color:顏色;
6、分區元素目的:為元素進行分組,多數用在布局中;
塊分區元素:<div></div> ;
行內分區元素:<span></span>;
注意:
div :主要用在布局上;
span:修改其內部內容的樣式;
7、預格式化,保留源文檔中的空格和回車 <pre>文本內容 </pre>;
8、注釋
可以寫在html源碼中,但不被瀏覽器解釋的文本;
語法: <!-- 注釋內容 -->
!!!特別注意:行內元素與塊級元素
塊級元素:默認情況下,塊級元素獨占一行,元素的前后都會自動換行 div、hn、hr、p等 主要用于布局。
行內元素:默認情況,多個元素位于同一行,不會換行,span、文本標記... .主要行內元素作用:修改內部內容的樣式。
關于“HTML標簽語法的知識點有哪些”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識,可以關注億速云行業資訊頻道,小編每天都會為大家更新不同的知識點。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。