文档章节

table-样式1

0000001
 0000001
发布于 2014/06/28 10:44
字数 253
阅读 15
收藏 0
点赞 0
评论 0

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>table-</title>
</head>
<body>
 <!-- Javascript goes in the document HEAD -->
<script type="text/javascript">
function altRows(id){
 if(document.getElementsByTagName){ 
  
  var table = document.getElementById(id); 
  var rows = table.getElementsByTagName("tr");
  
  for(i = 0; i < rows.length; i++){         
   if(i % 2 == 0){
    rows[i].className = "evenrowcolor";
   }else{
    rows[i].className = "oddrowcolor";
   }     
  }
 }
}

window.onload=function(){
 altRows('alternatecolor');
}
</script>


<!-- CSS goes in the document HEAD or added to your external stylesheet -->
<style type="text/css">
table.altrowstable {
 font-family: verdana,arial,sans-serif;
 font-size:11px;
 color:#333333;
 border-width: 1px;
 border-color: #a9c6c9;
 border-collapse: collapse;
}
table.altrowstable th {
 border-width: 1px;
 padding: 8px;
 border-style: solid;
 border-color: #a9c6c9;
}
table.altrowstable td {
 border-width: 1px;
 padding: 8px;
 border-style: solid;
 border-color: #a9c6c9;
}
.oddrowcolor{
 background-color:#d4e3e5;
}
.evenrowcolor{
 background-color:#c3dde0;
}
</style>


<!-- Table goes in the document BODY -->
<table id="alternatecolor">
<tr>
 <th>Info Header 1</th><th>Info Header 2</th><th>Info Header 3</th>
</tr>
<tr>
 <td>Text 1A</td><td>Text 1B</td><td>Text 1C</td>
</tr>
<tr>
 <td>Text 2A</td><td>Text 2B</td><td>Text 2C</td>
</tr>
</tr>
<tr>
 <td>Text 3A</td><td>Text 3B</td><td>Text 3C</td>
</tr>
<tr>
 <td>Text 4A</td><td>Text 4B</td><td>Text 4C</td>
</tr>
<tr>
 <td>Text 5A</td><td>Text 5B</td><td>Text 5C</td>
</tr>
</table>

<!--  The table code can be found here: http://www.textfixer/resources/css-tables.php#css-table03 -->

 

</body>
</html>

本文转载自:http://blog.csdn.net/nightelve/article/details/7957726

共有 人打赏支持
0000001
粉丝 35
博文 141
码字总数 46256
作品 0
朝阳
前端工程师
[css] table-layout:fixed 属性的解说,IE、Firefox效果对比详解

table-layout:fixed 属性的解说 如果想要一个table固定大小,里面的文字强制换行(尤其是在一长串英文文本,并且中间无空格分隔的情 况下),以达到使过长的文字不撑破表格的目的,一般是使用样...

Dicky
2011/12/07
0
0
表格行与列边框样式处理的原理分析及实战应用

欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 作者:韩宇波 导语:table之间的边框存在共用问题,自然而然就存在冲突。既然存在冲突,那么就势必涉及到最后渲染哪一个样式的问题...

腾讯云加社区
2017/11/07
0
0
TABLE固定宽度输出文本自动换行

浏览器会根据页面的大小和table的内容自动的调整table中单元格的宽度,如需要固定表格中单元格的宽度: 1、最后一列的单元格样式设定为width:auto;同时表格的整体宽度需要大于所有单元格宽度...

求渔
2012/12/23
0
0
CSS注意事项(一)

层叠的概念 层叠规则重点:自上而下,相同属性:一般后面的覆盖前面的,优先级高的覆盖优先级低的 层叠是CSS的核心机制,理解了它才能以最经济的方式写出最容易改动的CSS, 让文档外观在达到...

ShirlyK
2016/08/27
11
0
网站美化常见CSS

伴随网络时代日新月异的发展,用户不仅仅满足于软件系统的功能需求,对软件系统的页面显示效果以及交互模式的要求也逐渐提高。尤其是展示性质的平台页面对于界面美化效果要求更高,有一句话说...

数通畅联
2016/12/23
34
0
端程序员入门所要学习的16个知识点

1、HTML常用标签 语言是什么 、Web前端开发语言、 HTML超文本标记语言 、 网页主体结构 、常用标签、超链接(a标签)、Img图片标签 2、盒子模型 初探Div盒子模型 、css样式、 简单css样式、盒...

急速奔跑中的蜗牛
06/07
0
0
关于css中的border-collapse

这个属性以前并没有怎么接触过,该属性有两种1取值:separate 和 collapse 取值的含义具体如下: separate:边框独立 collapse:相邻边被合并 举例如下: <!DOCTYPE html> <html> <head> <met...

sunshinewyf
2015/10/22
28
0
HTML与浏览器默认样式整理(CSS布局参考资料)

html, address,blockquote,body, dd, div,dl, dt, fieldset, form,frame, frameset,h1, h2, h3, h4,h5, h6, noframes,ol, p, ul, center,dir, hr, menu, pre { display: block } li { displa......

杨军军
2011/11/06
0
0
bootstrap学习笔记

一.bootstrap的集成与引入 bootsrap中文网 bootstrap官网 集成方法一 下载bootstrap安装包 1.解压安装包后,将CSS、JS文件导入到项目中 2.在项目中引用 集成方法二 使用CDN在线下载 二.boot...

朱敏iOS
2017/11/17
0
0
HTML默认样式 和 浏览器默认样式

HTML默认样式 html, address,blockquote,body, dd, div,dl, dt, fieldset, form,frame, frameset,h1, h2, h3, h4,h5, h6, noframes,ol, p, ul, center,dir, hr, menu, pre { display: block ......

Yue_h
2014/02/10
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

大数据教程(2.13):keepalived+nginx(多主多活)高可用集群搭建教程【自动化脚本】

上一章节博主为大家介绍了目前大型互联网项目的keepalived+nginx(主备)高可用系统架构体系,相信大家应该看了博主的文章对keepalived/nginx技术已经有一定的了解,在本节博主将为大家分享k...

em_aaron
1分钟前
0
0
Git 2.18版本发布:支持Git协议v2,提升性能

在最新的官方 Git 客户端正式版2.18中添加了对 Git wire 协议 v2 的支持,并引入了一些性能与 UI 改进的新特性。在 Git 的核心团队成员 Brandon Williams 公开宣布这一消息前几周,Git 协议 ...

六库科技
6分钟前
0
0
Java8新特性之接口

在JDK8以前,我们定义接口类中,方法都是抽象的,并且不能存在静态方法。所有的方法命名规则基本上都是 public [返回类型] [方法名](参数params) throws [异常类型] {}。 JDK8为接口的定义带...

developlee的潇洒人生
44分钟前
0
0
aop + annotation 实现统一日志记录

aop + annotation 实现统一日志记录 在开发中,我们可能需要记录异常日志。由于异常比较分散,每个 service 方法都可能发生异常,如果我们都去做处理,会出现很多重复编码,也不好维护。这种...

长安一梦
54分钟前
2
0
将博客搬至CSDN

AHUSKY
今天
1
0
Python web框架Django学习(1)

1.Django简介 (1)Python下有许多款不同的 Web 框架。Django是重量级选手中最有代表性的一位。许多成功的网站和APP都基于Django。Django是一个开放源代码的Web应用框架,由Python写成。 (2...

十年磨一剑3344
今天
0
0
Databook-数据之书

Databook-数据之书 用于数据分析的Jupyter Notebooks。 不需购买服务器,快速开始自己的数据分析过程。 源码:https://github.com/openthings/databook 作者:openthings,https://github.co...

openthings
今天
5
0
Python PIPEs

https://www.python-course.eu/pipes.php https://www.tutorialspoint.com/python/os_pipe.htm

zungyiu
今天
1
0
gRPC学习笔记

gRPC编程流程 1. proto文件定义 proto文件用于定义需要通过gRPC生成的接口,可以理解为接口定义文档 2. 通过构建工具生成服务基类代码-Maven或Gradle 3. 服务端开发 服务端实现类须实现通过构...

OSC_fly
今天
0
0
Docker Mac (三) Dockerfile 及命令

Dockerfile 最近学习docker的时候,遇到一件怪事,关于docker镜像可能会被破坏,还不知道它会有此措施 所以需要了解构建Dockerfile的正确方法 Dockerfile是由一系列命令和参数构成的脚本,这些命...

___大侠
今天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部