网页制作中css定义id与class有什么区别?

2022-07-15 80酷酷网 80kuku.com

一. web标准中是不容许重复ID的,比如 div id="aa" 一个页面中不容许重复2次,而class 定义的是类,理论上可以无限重复的, 这样需要多次引用的定义便可以使用他.class还可以同时引用多个类,不同的类之间用空格隔开. 二. 属性的优先级问题,ID 的优先级要高于class,看上面的例子三. 方便JS等客户端脚本，如果在页面中要对某个对象进行脚本操作，那么可以给他定义一个ID，否则只能利用遍历页面元素加上指定特定属性来找到它，这是相对浪费时间资源，远远不如一个ID来得简单.

下面看看两侧代码示例来区分他们的区别:

以下是HTML网页特效代码，点击运行按钮可查看效果：以下是程序代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh"><head profile="http://www.w3.org/2000/08/w3c-synd/#"><meta http-equiv="content-language" content="zh-cn" /><meta http-equiv="content-type" content="text/html;charset=gb2312" /><title>blueidea</title><style type="text/css">/*<![CDATA[*/#aa { color:red }.aa { color:blue }/*]]>*/</style></head><body><div id="aa" class="aa">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div></body></html></font></CODE><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a> [Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

以下是HTML网页特效代码，点击运行按钮可查看效果：以下是程序代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh"><head profile="http://www.w3.org/2000/08/w3c-synd/#"><meta http-equiv="content-language" content="zh-cn" /><meta http-equiv="content-type" content="text/html;charset=gb2312" /><title>blueidea</title><style type="text/css">/*<![CDATA[*/.a { color:orange }.b { background:#eee }.c { border:1px solid red }/*]]>*/</style></head><body><div class="a b c">aaaaaaaa</div></body></html></font><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a> [Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]