小白學習前端---第二天 HTML的基本屬性————1
一.HTML的屬性
1.1基本屬性
1.1.1三個基本屬性
class 定義類規則或者樣式規則
id 定義元素的唯一標識
stype 定義元素的樣式宣告
1.1.2不含三個基本屬性的元素
html、head 文件和頭部資訊基本結構
title 網頁標題
base 網頁的基準資訊
meta 網頁元資訊
param 元素引數資訊
stype、script 網頁的指令碼資訊和樣式
1.2語言屬性
1.2.1兩個屬性
lang 定義元素的語言程式碼或者編碼
dir 定義文字的方向
1.2.2不含語言屬性的元素
iframe、frameset、frame 網頁框架架構
br 換行標識
hr 結構裝飾線
base 網頁基準資訊
param 元素引數資訊
script 網頁的指令碼
列子:
<html dir="rtl" xml:lang="zh-CN"> <head> <meta http-equiv="content-type" content="text/html" charset="UTF-8"/> <title>標題在head標籤中</title> </head> <body id="myid" lang="zh-CN"> <h1>大標題</h1> <p><big>真香!!!</big></p> <p>真香</p> </body> </html>
效果:
1.3鍵盤屬性
accesskey 定義訪問某一個元素的快捷鍵
tabindex 定義tab鍵的索引編號
列子:
<html> <head> <meta http-equiv="content-type" content="text/html" charset="UTF-8"/> <title>tab鍵測試</title> </head> <from id="from1" name="from1" method="post" action=""> <!--放在表格裡--> <p><a tabindex="1">輸入你的賬號<input type="text" name="text1" id="text1"/></a></p> <p>輸入你的密碼<input type="password" name="password1" id="password1"/></p> <p><a tabindex="2">你是一個有夢想的人嗎? 是的<input name="checkbox1" type="checkbox" id="checkbox1" value="1"/></a> <a tabindex="3">怎麼會不是呢?<input name="checkbox2" type="checkbox" id="checkbox2" value="2"/></a> </p> <p>你是小天才嗎? <input name="button1" type="radio" value="1"/>不是 <input name="button1" type="radio" value="1"/>第二個不是 </p> </from> </html>
效果:
現在他的tab鍵的索引是按照你定義的順序來進行的
1.4內容屬性
1.4.1五個內容屬性
alt 定義元素的替換文字
title 定義元素的提示文字
longdese 定義元素包含的內容的大段描述資訊
cite 定義元素引用的資訊
datetime 定義元素包含內容的時間
列子:
<html> <head> <meta http-equiv="content-type" content="text/html" charset="UTF-8"/> <title>內容屬性</title> </head> <body> <p><a title="當你的滑鼠移動到這個元素上面的時候就會出現一個提示文字">把滑鼠移動到這裡</a></p> </body> </html>
效果:
1.4.2title屬性不能運用的元素
html head title base basefont meta param script這幾個屬性不能使用title屬性