HTML/CCS初学的小小收获(2)

1、类选择器与ID选择器的区别

类别选择器和ID选择器功能类似，两者的区别是一个页面上所有控件都ID不能重复,但class可以被多个 html控件套用。往往一个HTML页面是要配合CSS和javascript一起用。javascript里，可以用document.getElementById(id名称)来取得这个标签的object，然后操作。

区别 1：只能在文档中使用一次与类不同，在一个 HTML 文档中，ID 选择器会使用一次，而且仅一次。
区别 2：不能使用 ID 词列表不同于类选择器，ID 选择器不能结合使用，因为 ID 属性不允许有以空格分隔的词列表。
区别 3：ID 能包含更多含义类似于类，可以独立于元素来选择 ID。

<html>
    <head>
        <style type="text/css">
            #tid1{
                color:red; 
                background:yellow;}
            #tid2{
                color:yellow; 
                background:red;}
            .tclass1 {
                color:black;                
                font-weight:bold;
            }
            .tclass2 {
                 font-style:italic;
                 background:yellow;
            }
        </style>
    </head>
    <body>
        <p id="tid1">ID选择器1！</p>
        <p id="tid2">ID选择器2！</p>
        <p id="tid1 tid2">ID选择器1与ID选择器2结合错误 </p>
        <p class="tclass1">类选择器1!</p>
        <p class="tclass2">类选择器2!</p>
        <p class="tclass1 tclass2">类选择器1与类选择器2的结合!</p>
    </body>
</html>

2、属性选择器：

CSS 选择器参考手册

选择器描述

[attribute] 用于选取带有指定属性的元素。

[attribute=value] 用于选取带有指定属性和值的元素。

[attribute~=value] 用于选取属性值中包含指定词汇的元素。

[attribute|=value] 用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。

[attribute^=value] 匹配属性值以指定值开头的每个元素。

[attribute$=value] 匹配属性值以指定值结尾的每个元素。

[attribute*=value] 匹配属性值中包含指定值的每个元素。

3、<a/>与<html:link/>的简单区别

<a/>是通用html标准标签，只能通过href超链接，<html:link/>是struts标签库中的标签，不光可以用href，还可以通过action超链接。

一般情况使用<a/>，用action时才使用<html:link/>比较好

4、链接的四种状态：

a:link - 普通的、未被访问的链接

a:visited - 用户已访问的链接

a:hover - 鼠标指针位于链接的上方

a:active - 链接被点击的时刻

PS:在 IE 中，必须添加 <!DOCTYPE>，才能将 :hover 选择器用于除了 <a> 之外的其它元素。

posted on 2013-08-27 13:41 Tony.Qin 阅读(278) 评论(0) 编辑收藏举报