职业IT人-IT人生活圈

 找回密码
 成为会员
搜索
查看: 497|回复: 2

用CSS实现隔列变色的技术

[复制链接]
走失的猫咪 发表于 2011-6-15 10:46 | 显示全部楼层 |阅读模式
看了zhangjunji111的文章一个用CSS实现隔行变色的技术
想起了自己过去的一篇文章
十个最简单实用的Table设计模板
里面提到了用css+html来实现隔列变色的技术
使用 colgroup 和 col 这两个元素属性来定义不同列的 CSS


Html代码  
<table>  
   
    <!-- Colgroup -->  
       <colgroup>  
          <col class="vzebra-odd">  
          <col class="vzebra-even">  
          <col class="vzebra-odd">  
          <col class="vzebra-even">  
       </colgroup>  
   
    <!-- Table header -->  
       <thead>  
          <tr>  
             <th scope="col" id="vzebra-comedy">Employee</th>  
             ...   
          </tr>  
       </thead>  
       ...   
</table>  

<table>

    <!-- Colgroup -->
           <colgroup>
              <col class="vzebra-odd">
              <col class="vzebra-even">
              <col class="vzebra-odd">
              <col class="vzebra-even">
           </colgroup>

    <!-- Table header -->
           <thead>
              <tr>
                 <th scope="col" id="vzebra-comedy">Employee</th>
                 ...
              </tr>
           </thead>
           ...
</table>





只学java 发表于 2011-6-15 10:46 | 显示全部楼层
推荐链接
【推荐】java 新手是如何获得“8K月薪”的?
年薪100万诚邀IT讲师



话说我当年 发表于 2011-8-11 14:29 | 显示全部楼层
刚才我还看见了呢.
您需要登录后才可以回帖 登录 | 成为会员

本版积分规则

QQ|手机版|小黑屋|网站帮助|职业IT人-IT人生活圈 ( 粤ICP备12053935号-1 )|网站地图
本站文章版权归原发布者及原出处所有。内容为作者个人观点,并不代表本站赞同其观点和对其真实性负责,本站只提供参考并不构成任何投资及应用建议。本站是信息平台,网站上部分文章为转载,并不用于任何商业目的,我们已经尽可能的对作者和来源进行了通告,但是能力有限或疏忽造成漏登,请及时联系我们,我们将根据著作权人的要求立即更正或者删除有关内容。

GMT+8, 2024-5-5 03:26 , Processed in 0.126725 second(s), 20 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表