标题:求解class属性的用法
只看楼主
love云彩
Rank: 19Rank: 19Rank: 19Rank: 19Rank: 19Rank: 19
来 自:青藏高原
等 级:贵宾
威 望:53
帖 子:3663
专家分:11416
注 册:2012-11-17
结帖率:100%
 问题点数:0 回复次数:4 
求解class属性的用法
下面是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属性)

2013-05-20 20:58
zx396535633
Rank: 1
来 自:山西长治
等 级:新手上路
帖 子:17
专家分:8
注 册:2012-8-14
得分:0 
都可以用"class" 这是给tr增加一些样式,class是可以重复使用的样式,你的代码已经说明这些了。
还有一个是"id" 他是唯一的 不可以重复使用的,大都使用在网页的整个布局上,还有一些固定不变的东西也用“id”,比如 logo一些东西。
希望能帮到你,呵呵!!
2013-08-06 11:08
java小蚂蚁
Rank: 11Rank: 11Rank: 11Rank: 11
来 自:上海
等 级:贵宾
威 望:18
帖 子:558
专家分:2186
注 册:2013-7-2
得分:0 
这就相当于一个标签,我预先给class 定义一个属性,就像这段呢代码中,的old属性,然后在需呀用到的地方,或者使用同一个样式的地方加上一个class。就可以了,这就相当html里面的css样式一样,专门写一个css样式,然后那个页面要用到的话直接调用,一句话就可以了,整个项目就都能用了,这里就是整个页面都可以用class属性,当然这主要还是看你的才,class属性定义的范围,一般这种都是页面范围的。

学海无涯#¥%……&*(
2013-08-10 23:36
叹服vae
Rank: 2
等 级:论坛游民
帖 子:22
专家分:42
注 册:2012-9-28
得分:0 
有了class就可以在同一个tr里面做出区别来,tr.old表示所有tr里面的calss等于old的tr,可以参考http://www.
2013-08-25 15:46
huangyong
Rank: 20Rank: 20Rank: 20Rank: 20Rank: 20
来 自:湖北武汉
等 级:版主
威 望:20
帖 子:603
专家分:7
注 册:2006-7-21
得分:0 
ID一个页面只能使用一次,具有唯一性。
CLASS一个页面可以使用N次,使用CLASS可以大大节省了了时间的投入,提高网页前端的部分执行效率,而且更好的去维护和管理网页。


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

多次引用可以提高制作网页的效率和网页执行的效率,减少代码的加载时间。
2013-11-29 22:30



参与讨论请移步原网站贴子:https://bbs.bccn.net/thread-407567-1-1.html




关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.053145 second(s), 7 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved