编程论坛 → WEB前端(UI)

求解class属性的用法

love云彩发布于 2013-05-20 20:58， 1457 次点击

下面是Html文本body中的代码：
<body>
<table>
<tr>
<th>质量</th>
<th>原料</th>
</tr>
<tr class="old">   //重点是这里不懂的，这里的class 属性怎么用的
<td>3</td>
<td>eggs</td>
</tr>
<tr>
<td>100ml</td>
<td>milk</td>
</tr>
<tr class="old">
<td>200g</td>
<td>spinach</td>
</tr>
<tr>
<td>1 spinach</td>
<td>cinnamon</td>
</tr>
</table>
</body>
然后建立一个css样式表，样式表中的代码如下：
@charset "utf-8";
/* CSS Document */
body{
    background-color:#C03;
    font-family:arial, verdana, sans-serif;
    font-size:14px;}
    table{
        border-style:solid;
        border-width:2px;
        border-color:#FF3;}
th{
    color:#ffffff;
    background:-color:#039;
    font-weight:bold;
    border:none;
    padding:10px;}
tr{
    background:-color:#0C3;}
tr.old{ background:-color:#606;}//这里为什么要写上old的属性
td{
    colot:#000000;
    padding:2px;}
（什么时候使用class属性，有哪些标签使用到class属性）

4 回复

#2

zx3965356332013-08-06 11:08

都可以用"class" 这是给tr增加一些样式，class是可以重复使用的样式，你的代码已经说明这些了。
还有一个是"id" 他是唯一的不可以重复使用的，大都使用在网页的整个布局上，还有一些固定不变的东西也用“id”，比如 logo一些东西。
希望能帮到你，呵呵！！

#3

java小蚂蚁2013-08-10 23:36

这就相当于一个标签，我预先给class 定义一个属性，就像这段呢代码中，的old属性，然后在需呀用到的地方，或者使用同一个样式的地方加上一个class。就可以了，这就相当html里面的css样式一样，专门写一个css样式，然后那个页面要用到的话直接调用，一句话就可以了，整个项目就都能用了，这里就是整个页面都可以用class属性，当然这主要还是看你的才，class属性定义的范围，一般这种都是页面范围的。

#4

叹服vae2013-08-25 15:46

有了class就可以在同一个tr里面做出区别来，tr.old表示所有tr里面的calss等于old的tr，可以参考http://www.

#5

huangyong2013-11-29 22:30

ID一个页面只能使用一次，具有唯一性。
CLASS一个页面可以使用N次，使用CLASS可以大大节省了了时间的投入，提高网页前端的部分执行效率，而且更好的去维护和管理网页。

tr.old{ background-color:#606;}//这里为什么要写上old的属性
这个意思是标签<tr>的CLASS名为里写了名为 old 的样式，背景颜色为：#606

多次引用可以提高制作网页的效率和网页执行的效率，减少代码的加载时间。

1