网页设计中的HTML属性

  • 2019-07-15 09:33:03
  • 阅读次数:
  • 作者:盈岚科技小编
  • 来源:http://www.lyjtt.cn

网页设计时,每个HTML标签还包含很多属性,但是大部分属性都是公共的。公共属性大致可分为基本属性、语言属性、键盘属性、内容属性和延伸属性等类型。

1. 基本属性

基本属性主要包括下面3个,这3个基本属性为大部分元素所拥有。   

•class:定义类规则或样式规则。   

•id:定义元素的唯一标识。   

•style:定义元素的样式声明。

2. 语言属性

语言属性主要用来在网站建设时定义元素的语言类型,包括两个属性。   

lang:定义元素的语言代码或编码。  

•dir:定义文本的方向,包括ltr和rtl取值,分别表示从左向右和从右向左。

【示例1】分别为网页代码定义了中文简体的语言,字符对齐方式为从左到右的方式。第二行代码为body定义了美式英语。

<html xmlns="http://www.w1.org/1999/xhtml" 

dir="ltr" xml:lang="zh-CN">

<body id="myid">

3. 键盘属性

键盘属性定义元素的键盘访问方法,包括两个属性。   

•accesskey:定义访问某元素的键盘快捷键。   

•tabindex:定义元素的Tab键索引编号。

accesskey属性可以使用快捷键(Alt+字母)访问指定URL,但是浏览器不能很好地支持,在IE中仅激活超链接,需要配合Enter键确定,而在Firefox中没有反应。

【示例2】在导航菜单中经常设置快捷键。

<a href="http://www.mysite.cn/" accesskey="a">按住Alt键,按A键可以链接到mysite首页</a>tabindex属性用来定义元素的Tab键访问顺序,可以使用Tab键遍历页面中的所有链接和表单元素。遍历时会按照tabindex的大小决定顺序,当遍历到某个链接时,按Enter键即可打开链接页面。例如:

<a href="#" tabindex="1">Tab 1</a>

<a href="#" tabindex="3">Tab 3</a>

<a href="#" tabindex="2">Tab 2</a>

4. 内容属性

内容属性定义元素包含网站建设中内容的附加信息,这些信息对于元素来说具有重要的补充作用,避免元素本身包含信息不全而被误解。内容语义包括5个属性。

•alt:定义元素的替换文本。   

•title:定义元素的提示文本。   

•longdesc:定义元素包含内容的大段描述信息。   

•cite:定义元素包含内容的引用信息。   

•datetime:定义元素包含内容的日期和时间。alt和title是两个常用的属性,分别定义元素的替换文本和提示文本。

<a href="URL" title="提示文本">超链接</a><img src="URL" alt="替换文本" title="提示文本" />替换文本(Alternate Text)并不是用来做提示的(Tool Tip),或者更加确切地说,它并不是为图像提供额外说明信息的。相反,title属性才负责为元素提供额外说明信息。当图像无法显示时,必须准备替换的文本来替换无法显示的图像,这对于图像和图像热点是必需的,因此alt属性只能用在img、area和input元素中(包括applet元素)。

【示例3】下面示例使用<input>标签定义一个图像按钮,但没有设置src属性值,则会显示“替换文本”的文字按钮效果。<input type="image" src="URL" alt="替换文本" />.title属性为元素提供提示性的参考信息,这些信息是一些额外的说明,具有非本质性,因此该属性也不是一个必须设置的属性。当鼠标指针移到元素上面时,即可看到这些提示信息。如果要为元素定义更长的描述信息,则应该使用longdesc属性。longdesc属性可以用来提供链接到一个包含图片描述信息的单独页面或者长段描述信息。其用法如下。

<img src="URL" alt="人物照" title="张三于2015-5-1上海留念" longdesc="这是张三于2015年5月1日在上海留影,当时天很热,场面热闹非凡" />或者<img src="UTL" alt="替换文本" longdesc="详细描述图像的网页.html" />cite一般用来定义引用信息的URL。例如,下面一段文字引自http://www.mysite.cn/csslay-out/index.htm,所以可以这样来设置。

<blockquote cite="http://www.mysite.cn/csslayout/index.htm">    

<p>CSS的精髓是布局,而不是样式,布局需要缜密的结构分析和设计</p>

</blockquote>

datetime属性定义包含文本的时间,这个时间表示信息的发布时间,也可能是更新时间,例如:

<ins datetime="2015-5-1 8:0:0">2015年上海</ins>

当前文章标题:网页设计中的HTML属性

当前URL:http://www.lyjtt.cn/news/wzzz/3052.html

上一篇:网页设计中的HTML标签(二)

下一篇:网站建设中的CSS基础

网站建设、网络营销咨询专线:181-8386-5875(点击可一键拨号)