联系站长 加入收藏 设为首页 繁體中文 RSS
  首页 | 生活百科 | 电脑网络 | 高手学堂 | 语录名言 | 读书文学 | 极品软件 | 奇趣图片 | 站长微博  
 您的位置: 精品百字节网 >> 电脑网络 >> 网络编程 >> CSS学习 >> 正文 当前没有通告!
   □  利用th,colgroup,col定义表格样式    4星级
利用th,colgroup,col定义表格样式
[ 作者:作者不详     来源:互连网     点击数:     更新时间:2007-10-20     文章录入:Admin
【字体:
[内容提要]
暂无简介

代码如下:这样的好处是不用一个个定义td,简化代码
<style>
table.Demo {
  border-collapse: collapse;
  color: #454545;
  font: 11px/150% Verdana, Arial, Helvetica, sans-serif;
}
table.Demo th {
  padding: 3px 7px;
  border: 1px solid #f60;
  border-width: 2px 1px 1px;
  background: #ffffe1;
}
table.Demo td {
  padding: 3px 7px;
  border: 1px solid #f60;
}
table.Demo col.Col1 {
  text-align: right;
  background: #f5f5f5;
}
table.Demo col.Col2 {
  color: #00c;
}
table.Demo col.Col3 {
  font-style: italic;
}
</style>

<table class="Demo">
  <tr>
    <th>TagName</th>
    <th>ClassName</th>
    <th>CSS</th>
  </tr>
  <colgroup>
    <col class="Col1" />
    <col class="Col2" />
    <col class="Col3" />
  </colgroup>
  <tr>
    <td>table</td>
    <td>Demo</td>
    <td>border-collapse: collapse;<br />color: #454545;<br />font: 11px/150% Verdana, Arial, Helvetica, sans-serif;</td>
  </tr>
  <tr>
    <td>th</td>
    <td></td>
    <td>padding: 3px 7px;<br />border: 1px solid #f60;<br />border-width: 2px 1px 1px;<br />background: #ffffe1;</td> 
  </tr>
  <tr>
    <td>td</td>
    <td></td>
    <td>padding: 3px 7px;<br />border: 1px solid #f60;</td>
  </tr>
  <tr>
    <td>col</td>
    <td>Col1</td>
    <td>text-align: right;<br />background: #f5f5f5;</td>
  </tr>
  <tr>
    <td>col</td>
    <td>Col2</td>
    <td>color: #00c;</td>
  </tr>
  <tr>
    <td>col</td>
    <td>Col3</td>
    <td>font-style: italic;</td>
  </tr>
</table>

上一篇文章:CSS滤镜用法详解 下一篇文章:CSS滤镜渐变效果应用
发表评论 □告诉好友 □打印此文 □收藏此页 □关闭窗口 □返回顶部
 最新热点文章
 精品医院类网站网址大收集
 如何删除windows 2003或xp系统隐藏的...
 DedeCms管理员后台登陆经常自动退出的...
 知道IP如何用dos命令查出电脑名称
 WORD出错老是要求以安全模式打开文件...
 如何设置首页不显示页眉页脚?
 如何利用inurl命令查询网站外链及栏目...
 
 最新推荐文章
 精品医院类网站网址大收集
 如何利用宽带路由器控制局域网内电脑上...
 CSS圆角代码的实现方法
 带停顿的单行文字滚动代码
 实用的新网站免费收录提交地址精选
 Left join , Right Join, Inner Join用...
 趣话淘宝网衍生的多种新型职业
 
 最新图文
  ◇  网友评论:(只显示最新5条。评论内容只代表网友观点,与本站立场无关!)
关于本站 | 免责申明 | 网站地图 | 联系站长 | 友情链接 | 与我同在
冀ICP备06032589号【虚拟化精英群虚拟化精英群续
  Copyright© 2006-2009 100byte.Com All Rights Reserved
网站声明:本网站是公益性质网站,部分内容来源于网络,如有侵犯您权利的地方,请与精品百字节站长联系,尽快修正.
Powered By CreateLive CMS 本站法律顾问:(冀港)武镇海律师
点击这里给我发消息