整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
性是 HTML 元素提供的附加信息。
HTML 屬性
HTML 元素可以設置屬性
屬性可以在元素中添加附加信息
屬性一般描述于開始標簽
屬性總是以名稱/值對的形式出現，比如：name="value"。
屬性實例
HTML 鏈接由 <a> 標簽定義。鏈接的地址在 href 屬性中指定：
實例
<a>這是一個鏈接</a>
HTML 屬性常用引用屬性值
屬性值應該始終被包括在引號內。
雙引號是最常用的，不過使用單引號也沒有問題。
提示: 在某些個別的情況下，比如屬性值本身就含有雙引號，那么您必須使用單引號，例如：name='John "ShotGun" Nelson'
HTML 提示：使用小寫屬性
屬性和屬性值對大小寫不敏感。
不過，萬維網聯盟在其 HTML 4 推薦標準中推薦小寫的屬性/屬性值。
而新版本的 (X)HTML 要求使用小寫屬性。
HTML 屬性參考手冊
查看完整的HTML屬性列表: HTML 標簽參考手冊。
下面列出了適用于大多數 HTML 元素的屬性：
| 屬性 | 描述 |
|---|---|
| class | 為html元素定義一個或多個類名（classname）(類名從樣式文件引入) |
| id | 定義元素的唯一id |
| style | 規定元素的行內樣式（inline style） |
| title | 描述了元素的額外信息 (作為工具條使用) |
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
多時候對有前端工程師來講，頁面效果直接會轉嫁個CSS或JS，對HTML的一些屬性了解的并不充分，接下來介紹一些有意思的HTML屬性。
1）Multiple
顧名思義就是在一個輸入標簽或選擇標簽中可以輸入多個值
<input type="file" multiple>2）Accept
在<input>包含接受屬性，允許用戶傷上傳指定的文件類型。我們在設置的過程中，需要設置指定的文件格式。并用逗號分開即可。傳遞文件類型包含圖片、音頻、視頻、文檔，等自定義文件類型。
<input type="file" accept=".png, .jpg">3）Contenteditable
這個屬性比較有意思，允許用戶在前端HTML頁面進行對文本的編輯，只對DOM的可見部分進行編輯。
<div contenteditable="true">我可以隨意編輯！</div>4）Spellcheck
進行拼寫檢查的可編輯段落：
<p contenteditable="true" spellcheck="true">這是一個段落。</p>5) Translate
Translate告訴瀏覽器是否應該翻譯內容。例如，您可以使用它來防止Google Translate自動嘗試翻譯您的公司或品牌名稱。
<footer><p translate="no">Mark</p></footer>6) Poster
帶有預覽圖（海報圖片）的視頻播放器：
注釋：Internet Explorer 8 以及更早的版本不支持 <video> 標簽。
<video controls poster="/images/mark.gif">
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video> 7) Download
download 屬性規定被下載的超鏈接目標。
在 <a> 標簽中必須設置 href 屬性。
該屬性也可以設置一個值來規定下載文件的名稱。所允許的值沒有限制，瀏覽器將自動檢測正確的文件擴展名并添加到文件 (.img, .pdf, .txt, .html, 等等)。
在前端開發編寫html文件的時候，我們可能會很熟練的寫出常見的html元素，但是如果問到某些元素的差別時，大家不一定能說的出來，今天就給大家總結一下那些很常見但容易混淆的屬性。
html與css
css樣式文件引入的方式有兩種，分別是link標簽和@import。
link語法結構
link語法結構如下，注意rel='stylesheet'屬性要加上。
link語法結構
@import語法結構
當@import用在html中時，需要配合style標簽
@import在html中
當@import用在css文件中，直接使用@import url()即可
@import在css中
既然link與@import都可以用來引入css，那么它們的區別是什么呢？我們又該如何選擇呢？
link是XHTML標簽的一種，除了可以加載css外，還可以定義其他rel屬性，而@import只能用來加載css。
link標簽在加載css時，與頁面一同加載，而@import需要等到網頁完全加載以后才進行加載。
link是XHTML標簽，不存在兼容問題，而@import是在CSS2.1中提出的，對于低版本的瀏覽器不支持。
link標簽可以通過Javascript代碼去控制其屬性，而@import不可以。
javascript控制link
@import支持在css文件中再次引入其他css文件，方便對多個css文件的管理。
因為@import引入的文件需要在網頁完全加載后再加載，如果在網絡速度較慢的情況下，會出現頁面閃現，因此建議使用link標簽代替@import。
html元素的readonly與disabled屬性一般都是用于無法改變表單的內容，但是兩者也是有區別的。
readonly屬性只針對input(text,password)和textarea元素，而disabled適用于所有表單元素，包括select,radio,checkbox,button等。
在表單元素使用了disabled后，該元素的的值不會隨著form的action請求傳遞到服務器端，而使用readonly的元素值可以傳遞到服務器端。
以下是一些關于兩者的使用建議。
在表單中為用戶預填的唯一標識碼，不允許用戶改動，而且需要傳遞到后臺的使用readonly屬性。
用戶提交完表單元素后，等待服務器端的驗證，這個過程應該將元素設為disabled，button和submit也應該設為disabled，以防止重復提交。
title屬性
img標簽的title屬性是用來提供一些建議性的信息，在鼠標停留在上方時會顯示，它對于圖片來說只是一種注釋性的信息，重要性偏低。
alt屬性
alt屬性是為不能顯示圖像時，用來指定替換文字，需要注意的是替換文字是用來代替文字的，而不是用來注釋文字的。
屬性的使用
在做圖片為主的網頁時，考慮到網頁的SEO，應當設置圖片的alt屬性為圖片的真實內容，而給title設置一些建議性的內容。
今天這篇文章主要將了幾個html中容易混淆的屬性，你有收獲嗎？
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
