个性化阅读
专注于IT技术分析

html属性 – HTML教程

上一章HTML教程请查看:html元素

我们已经看到了一些HTML标签和它们的用法,如标题标签<h1>, <h2>,段落标签<p>和其他标签。到目前为止,我们以最简单的形式使用它们,但是大多数HTML标记也可以有属性,这些属性是额外的信息。

属性用于定义HTML元素的特征,并放置在元素的开始标记中,所有的属性都由两部分组成——名称和值

  • 名称是你想要设置的属性。例如,本例中的段落<p>元素带有一个名为align的属性,你可以使用该属性来指示页面上段落的对齐方式。
  • 该值是你希望设置的属性值,并始终放在引号内。下面的示例显示了align属性的三个可能值:左、中、右。

属性名和属性值不区分大小写,然而,万维网联盟(W3C)在他们的HTML 4推荐中推荐小写的属性/属性值。

例子

<!DOCTYPE html> 
<html>
 
   <head> 
      <title>对齐属性示例</title> 
   </head>
    
   <body> 
      <p align = "left">左对齐</p> 
      <p align = "center">居中对齐</p> 
      <p align = "right">右对齐</p> 
   </body>
    
</html>

核心属性

可以用于大多数HTML元素(尽管不是全部)的四个核心属性是-

  • Id
  • 标题title
  • 类class
  • 风格style

Id属性

HTML标记的id属性可用于惟一地标识HTML页面中的任何元素。在元素上使用id属性有两个主要原因:

  • 如果一个元素带有一个id属性作为唯一的标识符,那么就可以只识别该元素及其内容。
  • 如果在Web页面(或样式表)中有两个同名的元素,可以使用id属性来区分具有相同名称的元素。

我们将在单独的教程中讨论样式表,现在,让我们使用id属性来区分两个段落元素,如下所示。

例子

<p id = "html">HTML文本</p>
<p id = "css">内联样式表</p>

title属性

title属性为元素提供建议的标题,title属性的语法与id属性的语法类似。

此属性的行为将取决于携带它的元素,尽管当光标移到元素上方或元素加载时,它通常显示为工具提示。

例子

<!DOCTYPE html>
<html>

   <head>
      <title>title属性示例/title>
   </head>
    
   <body>
      <h3 title = "Hello HTML!">标题标签示例</h3>
   </body>
    
</html>

现在尝试将你的光标移到“标题标签示例”上,你将看到你在代码中使用的任何标题都将作为光标的工具提示显示出来。

class属性

class属性用于将元素与样式表关联,并指定元素的类。在学习层叠样式表(CSS)时,你将了解更多关于class属性的用法,所以现在你可以避免它。

属性的值也可以是用空格分隔的类名列表。例如−

class = "className1 className2 className3"

style样式属性

style属性允许你在元素中指定层叠样式表(CSS)规则。

<!DOCTYPE html>
<html>

   <head>
      <title>style属性</title>
   </head>
    
   <body>
      <p style = "font-family:arial; color:#FF0000;">段落文本...</p>
   </body>
    
</html>

在这一点上,我们还没有学习CSS,所以让我们继续不去管CSS。在这里,你需要了解什么是HTML属性,以及在格式化内容时如何使用它们。

国际化属性

有三个国际化属性,对于大多数(尽管不是所有)XHTML元素都是可用的。

  • dir
  • lang
  • xml:lang

dir属性

dir属性允许你向浏览器指示文本应该流动的方向,dir属性可以取两个值中的一个,如下表所示

解释
ltr 从左到右(默认值)
rtl 从右向左(用于从右向左阅读希伯来语或阿拉伯语等语言)

例子

<!DOCTYPE html>
<html dir = "rtl">

   <head>
      <title>显示的方向</title>
   </head>
    
   <body>
   这就是IE 5如何呈现从右到左的有向文本.
   </body>
    
</html>

当在<html>标记中使用dir属性时,它将确定文本在整个文档中的显示方式。当在另一个标记中使用时,它仅为该标记的内容控制文本的方向。

lang属性

lang属性允许你指示文档中使用的主要语言,但是这个属性保留在HTML中,只是为了向后兼容较早版本的HTML。在新的XHTML文档中,这个属性已经被xml:lang属性所取代。

lang属性的值是ISO-639标准双字符语言代码,查看HTML语言代码:ISO 639以获得完整的语言代码列表。

例子

<!DOCTYPE html>
<html lang = "en">

   <head>
      <title>英文页面</title>
   </head>

   <body>
      该页面使用英语
   </body>

</html>

xml:lang属性

xml:lang属性是替代lang属性的XHTML,如前一节所述,xml:lang属性的值应该是ISO-639国家代码。

通用属性

下面是一些其他属性的表,它们很容易与许多HTML标记一起使用。

属性 选项 功能
align 左,右,中心 水平对齐标签
valign 顶部,中间,底部 对HTML元素中的标记进行垂直对齐。
bgcolor 数值,十六进制,RGB值 在元素后面放置背景色
background URL 在元素后面放置背景图像
id 用户定义 为与级联样式表一起使用的元素命名。
class 用户定义 将元素分类以与级联样式表一起使用。
width 数值 指定表、图像或表单元格的宽度。
height 数值 指定表、映像或表单元格的高度。
title 用户定义 元素的“弹出式”标题。

我们将看到相关的例子,因为我们将继续研究其他HTML标记。有关HTML标记和相关属性的完整列表,请参阅HTML标记列表。

赞(0)
未经允许不得转载:srcmini » html属性 – HTML教程

评论 抢沙发

评论前必须登录!