html全局屬性是什么意思

這篇文章主要講解了“html全局屬性是什么意思”,文中的講解內(nèi)容簡單清晰,易于學(xué)習(xí)與理解,下面請(qǐng)大家跟著小編的思路慢慢深入,一起來研究和學(xué)習(xí)“html全局屬性是什么意思”吧!

網(wǎng)站建設(shè)哪家好,找創(chuàng)新互聯(lián)!專注于網(wǎng)頁設(shè)計(jì)、網(wǎng)站建設(shè)、微信開發(fā)、小程序定制開發(fā)、集團(tuán)企業(yè)網(wǎng)站建設(shè)等服務(wù)項(xiàng)目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了仙居免費(fèi)建站歡迎大家使用!

在html中,全局屬性是指可以用來配置所有元素共有行為、可以用在任何一個(gè)元素身上的屬性。常用全局屬性有:class、hidden、id、lang、style、title、dir、contenteditable等等。

html全局屬性是什么意思

本教程操作環(huán)境:windows7系統(tǒng)、HTML5版、Dell G3電腦。

局部屬性:有些元素能規(guī)定自己的屬性,這種屬性稱為局部屬性。 比如 link 元素,它具有的局部屬性有 href、 rel、 hreflang、 media、 type、 sizes 這六個(gè)。

全局屬性:可以用來配置所有元素共有的行為,這種屬性稱為全局屬性,可以用在任何一個(gè)元素身上。

1、accesskey 屬性

使用 accesskey 屬性可以設(shè)定一個(gè)或幾個(gè)用來選擇頁面上的元素的快捷鍵。

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta >
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>HTML全局屬性測試</title>
</head>
<body>
  <form action="">
      <p>
          Name: <input type="text" >                
      </p>
      <p>
          Password: <input type="password" >                
      </p>
      <p>
          Name: <input type="submit" >                
      </p>
  </form>
</body>
</html>

在上面的例子中,三個(gè) input 元素添加了 accesskey 屬性,這樣在 Mac 下就可以用 Control + Alt(Option) + n快捷鍵訪問到 Name 的輸入框了。用來觸發(fā) accesskey 機(jī)制的按鍵組合因平臺(tái)而異,具體如下:

瀏覽器 / 平臺(tái)WindowLinuxMac
FirefoxAlt + Shift + keyAlt + Shift + keyControl + Alt + key
Internet ExplorerAlt + keyN/AN/A
Google ChromeAlt + keyAlt + keyControl + Alt + key
SafariAlt + keyN/AControl + Alt + key
Opera同 Google Chrome同 Google Chrome同 Google Chrome

關(guān)于 accesskey 這個(gè)全局屬性的詳解,可以看一下 HTML accesskey 屬性與 web 自定義鍵盤快捷訪問

2、class 屬性

class 屬性用來將元素歸類,這個(gè)就無需多言了。

3、contenteditable 屬性

contenteditable 是 HTML5 中新增加的屬性,,其用途是讓用戶能夠修改頁面上的內(nèi)容。

<body>
   <!-- contenteditable屬性應(yīng)用 -->
   <p contenteditable="true">設(shè)置為 true 是可編輯的</p>
  </body>

如上例,p 元素的 contenteditable 屬性值設(shè)置為 true 時(shí),用戶可以單擊文字編輯內(nèi)容。設(shè)置為 false 時(shí)禁止編輯。

4、dir 屬性

dir 屬性用來規(guī)定元素中文字的方向。有效值有兩個(gè):ltr(從左到右)、rtl(從右到左)。

<!-- dir屬性應(yīng)用 -->
<p dir="ltr">從左到右</p>
<p dir="rtl">從右到左</p>

5、draggable 屬性

draggable 屬性是 HTML5 支持拖放操作的方式之一,用來表示元素是否可被拖放。

6、dropzone 屬性

dropzone 屬性是 HTML5 支持拖放操作的方式之一,與 draggable 屬性搭配使用。

7、id 屬性

id 屬性用來給元素分配一個(gè)唯一的標(biāo)識(shí)符。這個(gè)也無需多言。需要說明的一點(diǎn)是,id 屬性還可以用來導(dǎo)航到文檔中的特定位置。

8、hidden 屬性

hidden 是個(gè)布爾屬性,表示相關(guān)元素當(dāng)前不需要關(guān)注,瀏覽器對(duì)它的處理方式是隱藏相關(guān)元素(隱隱想起來控制一個(gè)元素的展示隱藏的時(shí)候,會(huì)自定義一個(gè) hidden 類,然后在里面寫隱藏樣式),具體也可以看一下這篇介紹 HTML5 的 hidden 屬性

<!-- hidden屬性應(yīng)用 -->
<div hidden>這個(gè)元素將會(huì)被隱藏</div>

9、lang 屬性

lang 屬性用于說明元素內(nèi)容使用的語言。lang 屬性必須使用有效的 ISO 語音代碼,使用這個(gè)屬性的目的在于,讓瀏覽器調(diào)整其表達(dá)元素內(nèi)容的方式,比如在使用了文字朗讀器的情況下正確發(fā)音。

<!-- lang屬性應(yīng)用 -->
<p>Hello - how are you?</p>

10、spellcheck 屬性

spellcheck 屬性用來表明瀏覽器是否應(yīng)該對(duì)元素的內(nèi)容進(jìn)行拼寫檢查,這個(gè)屬性只有用在用戶可以編輯的元素上時(shí)才有意義。 spellcheck 屬性可以接受的值有兩個(gè):true 和 false。至于拼寫檢查的實(shí)現(xiàn)方式則因?yàn)g覽器而異。

<!-- spellcheck屬性應(yīng)用 -->
 <textarea >This is some lalalala text</textarea>

11、style 屬性

style 屬性用來直接在元素身上定義 CSS 樣式,這個(gè)也不做過多描述了。

12、tabindex 屬性

HTML 頁面的鍵盤焦點(diǎn)可以通過按 Tab 鍵在各元素之間切換。用 tabindex 屬性可以改變默認(rèn)的轉(zhuǎn)移順序。

<!-- tabindex屬性應(yīng)用 -->
 <form action="">
    <label>Name: <input type="text" ></label>
    <label>City: <input type="text" ></label>
    <label>Country: <input type="text" ></label>
    <input type="submit" value="" tabindex="3">
 </form>

上面的代碼實(shí)現(xiàn)效果是:在按 Tab 鍵的過程中,tabindex 為 1 的 Country 輸入框第一個(gè)被選中,接著焦點(diǎn)會(huì)跳到 Name 輸入框,最后是 submit 提交。tabindex 設(shè)置為 - 1 的元素不會(huì)在用戶按下 Tab 鍵后被選中。

13、title 屬性

title 屬性提供了元素的額外信息,瀏覽器通常用這些東西顯示工具條提示,這個(gè)在一些展示不全的文本標(biāo)題也經(jīng)常使用。

<!-- title屬性應(yīng)用 -->
<a href="https://qiqihaobenben.github.io/" title="我的個(gè)人網(wǎng)站">qiqihaobenben.github.io</a>

14、contextmenu 屬性

自定義鼠標(biāo)右鍵彈出菜單內(nèi)容

15、data-* 屬性

為元素增加自定義屬性

16、translate 屬性

元素和子孫節(jié)點(diǎn)內(nèi)容是否需要本地化

感謝各位的閱讀,以上就是“html全局屬性是什么意思”的內(nèi)容了,經(jīng)過本文的學(xué)習(xí)后,相信大家對(duì)html全局屬性是什么意思這一問題有了更深刻的體會(huì),具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是創(chuàng)新互聯(lián),小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章,歡迎關(guān)注!

當(dāng)前題目:html全局屬性是什么意思
文章出自:http://www.muchs.cn/article14/ijcpge.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)、自適應(yīng)網(wǎng)站域名注冊(cè)、微信小程序、商城網(wǎng)站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

成都網(wǎng)頁設(shè)計(jì)公司