HTML属性



属性提供了关于HTML元素的额外信息


HTML 属性

  • 所有的HTML元素都能有属性
  • 属性提供了关于HTML元素的额外信息
  • 属性总是在开始标签里面设置
  • 属性通常以键值对的形式出现:例如:name="value"

lang 属性

文档的语言声明在<html>标签里

语言用lang属性声明

声明语言对辅助应用(屏幕阅读器)和搜索引擎都很重要

<!DOCTYPE html>
<html lang="en-US">
<body>

...

</body>
</html>

前面两个字母指定语言,如果有方言,横线后面的两个字母可以指定方言

title 属性

下面在段落元素<p>里面添加一个title属性,当鼠标经过段落时标题属性将作为一个提示显示出来。

例如:

<h2>这是一个标题属性</h2>
<p title="这是一个提示">
 鼠标放在段落上会显示这个提示。
</p>

让我试试

href属性

HTML使用<a>来定义链接,链接地址通过href设置

例如:

<a href="http://www.CodingDict.com">编程字典</a>

让我试试

在后面的章节中你将学到更多有关<a>元素和链接的知识


size属性

HTML使用<img>来定义图片

使用src属性定义文件名称,使用widthheight定义图片的尺寸

例如:

<img src="new_logo.png" width="250" height="112">

让我试试

alt属性

当图片不能显示时,alt属性指定备选文本。

这些值能被屏幕阅读器读取,例如一些盲人可以听到

例如:

<img src="new_logo.png" alt="编程字典" width="250" height="112">

让我试试

我们建议使用小写属性

HTML5标准没有要求必须小写属性名称

标题属性可以大写或者小写,例如:Title或者TITLE

W3C推荐使用小写属性,并且一些严格的文档类型是要求小写的,例如XHTML

在我们的教程里面都是使用小写属性

我们建议扩住属性值

HTML5标准不要求必须括住属性值

链接的href属性可以写成如下:

例如:

<a href=http://www.CodingDict.com>编程字典</a>

让我试试

W3C推荐括住属性值,并且一些严格的文档类型是要求必须括住属性值,例如XHTML

有时候必须扩住属性值,例如:如果一个标题属性里面有空格,属性值不括住会出现错误

<p title=关于 编程字典>

让我试试

通常都使用括号,忽略括号有时会产生错误
在我们的教程里面属性值都使用括号

单引号和双引号

在HTML中一般使用双引号包围属性值,但是也可以使用单引号

有些情况下当属性值本身里面有双引号,可以外部使用单引号

<p title='John "ShotGun" Nelson'>

或者

<p title="John 'ShotGun' Nelson">

本章小结

  • 所有HTML元素都可以有属性
  • titile属性提供一个额外的'工具-提示'信息
  • href属性提供一个链接地址
  • width和height提供图片的宽度和高度尺寸
  • alt 提供屏幕阅读器可以阅读的备选信息
  • 我们的教程都使用小写的属性名称
  • 我们总是用双引号括住属性值

HTML属性

下面按照字母顺序列出了一些常用HTML属性

属性 描述
alt 指定当图片不能显示时的备选信息
disabled 指定输入元素是禁用的
href 指定链接的URL地址
id 指定元素的唯一id
src 指定图片的源路径
style 指定CSS行内样式
title 指定关于元素的额外信息