class选择器

lclass选择器,以定义一个命名的样式,然后在用到它的时候设定元素的class属性为样式的名称,还可以同时设定多个class,名称之间加空格
•样式名称开头加“.”《点就相当于一个标志,表示的是类选择器》
 
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 
 3 <html xmlns="http://www.w3.org/1999/xhtml">
 4 <head>
 5     <title></title>
 6    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
 7    <style type = "text/css">
 8        .txt
 9        {
10            width:200px;
11            color:Red;
12            background-color:Yellow;
13        }
14    </style>
15 </head>
16 <body>
17 <!--选择器对<input type="radio"  />、<input type="submit"  />不起作用-->
18     <input type="text" class = "txt" />
19    <input type="text"  class = "txt"/>
20    <input type="text"  class ="txt"/>
21    <input type="text"  class = "txt"/>
22   <input type="text"  class = "txt"/>
23   <input type="radio"  />
24    <input type="submit"  />
25 </body>
26 </html>

 

同一个标签可以应用多个类选择器(空格隔开)。如果样式表中的定义有重复,则以最后一个定义为准。
•.warning{background:Yellow;}
•.highlight{font-size:xx-large;cursor:help;}
1 <table>
2     <tr>
3         <td class="highlight">aaa</td>
4         <td class="warning">bb</td>
5         <td class="highlight warning">ccc</td>
6     </tr>
7 </table>

 

类选择的目的就是可以使代码重用,让任何标签都可以使用定义的类选择器

 

posted @ 2013-03-21 12:58  Big.Eagle  阅读(218)  评论(0)    收藏  举报