屬性(Attributes)
提供元素(Elements)額外的資訊
- 所有的元素(Elements)都有屬性(Attributes)
- 屬性(Attributes)都被寫在起始標籤中
- 屬性(Attributes)通常伴隨著屬性名稱(name)和屬性值(value), e.g.name="value"
常見的屬性
- href
"href"和"元素<a>"一起使用，提供特定的連結
e.g. <a href="https://www.google.com/">link</a>
- src
"src"和"元素<img>"一起使用，提供圖片的名稱
e.g. <img src="https://pbs.twimg.com/profile_images/927645314630193158/ufoYTbbi_400x400.jpg">
- width, height
可以元素(elements)的寬度、高度
- alt
兩個主要功能
- 圖片無法顯示時，可以顯示替代的文字
- 視障的使用者可以透過輔助器，聽到這些文字訊息
- style
用來設定元素(elements)的外觀，e.g. 顏色、字體...
- lang
用來設定整份html的語言，對無障礙環境和搜尋引擎而言特別重要
e.g. <html lang="en-US">
前面兩個字母是語言，後面兩個字母是方言(可省略)
延伸學習(關於lang)
https://www.injerry.com/blog-view.php?PID=5&sn=125
- title
滑鼠移過該元素(elements)時，會顯示的提示文字
e.g. <p title="tooltip"></p>
屬性建議用小寫(lowercase attributes)
理由和標籤一樣，W3C建議屬性都用小寫，其他格式e.g.XHTML，可能會嚴格強制小寫，所以就保持好習慣吧
屬性建議用引號把屬性值框住
e.g. <a href="https://www.google.com/">
雖然 <a href=https://www.google.com/> 也會正常執行，但有可能會有預期之外的錯誤，強烈建議要加引號，保持好習慣
單引號和雙引號的抉擇
雙引號是最為常見的，單引號也可以正常執行。但有時候屬性值(attribute value)本身帶有引號
e.g. <p title='Shawn "Awesome" Tseng'> 或 <p title="Shawn 'Awesome' Tseng">
此時便可交錯使用。
沒有留言:
張貼留言