.tab{
width: 100%;
margin:0;
padding:0;
font-family: "Trebuchet MS", Trebuchet, Arial, sans-serif;
color: #1c5d79;
border-top: 1px #c2c2c2;
border-bottom: 1px #c2c2c2;
border-left: 1px #c2c2c2;
border-right: 1px #c2c2c2;
border-collapse: collapse;
}
.tab caption {
margin:0;
padding:0;
background: #f3f3f3;
height: 40px;
line-height: 40px;
text-indent: 28px;
font-family: "Trebuchet MS", Trebuchet, Arial, sans-serif;
font-size: 14px;
font-weight: bold;
color: #555d6d;
text-align: left;
letter-spacing: 3px;
border-top: dashed 1px #c2c2c2;
border-bottom: dashed 1px #c2c2c2;
}
/* HEAD */
.tab thead {
background-color: #FFFFFF;
border: none;
}
.tab thead tr th {
background-image:url("/lottery/img/table/bg.gif");
height: 22px;
line-height: 22px;
text-align: center;
color: #1c5d79;
background-repeat : repeat-x;
border-left:solid 1px #326E87;
border-right:solid 1px #326E87;
border-bottom:solid 1px #326E87;
border-collapse: collapse;
font-size: 12px;
}
/* BODY */
.tab tbody tr {
background: #f3f3f3;
font-size: 13px;
height: 12px;
line-height: 12px;
text-align: center;
event:expression(
onmouseover = function(){this.style.backgroundColor = '#E9F5FF';},
onmouseout = function(){this.style.backgroundColor = '#f3f3f3';}
)
}
.tab tbody tr.odd {
background: #F0FFFF;
}
.tab tbody tr:hover, .tab tbody tr.odd:hover {
background: #ffffff;
}
.tab tbody tr th,.tab tbody tr td {
padding: 6px;
border: solid 1px #326e87;
}
.tab tbody tr th {
font-family: "Trebuchet MS", Trebuchet, Arial, sans-serif;
font-size: 12px;
padding: 6px;
text-align: center;
font-weight: bold;
color: #FFFFFF;
border-bottom: solid 1px white;
}
.tab tbody tr th:hover {
background: #ffffff;
}
/* LINKS */
.tab a{
color: gray;
text-decoration: none;
font-size: 13px;
border-bottom: solid 1px white;
}
.tab a:hover {
color: blue;
border-bottom: none;
}
/* FOOTER */
.tab tfoot {
background: #f3f3f3;
height: 24px;
line-height: 24px;
font-family: "Trebuchet MS", Trebuchet, Arial, sans-serif;
font-size: 12px;
/*font-weight: bold;*/
color: #555d6d;
text-align: center;
letter-spacing: 3px;
border-top: solid 2px #326e87;
border-bottom: dashed 1px #c2c2c2;
}
.tab tfoot tr th,.tab tfoot tr td {
/*padding: .1em .6em;*/
}
.tab tfoot tr th {
border-top: solid 1px #326e87;
}
.tab tfoot tr td {
/**text-align: right;**/
}
- 大小: 833 Bytes
分享到:
相关推荐
要创建一个带有圆角的表格,首先需要将表格的边框样式设置为实线,然后为`<table>`元素设置合适的`border-radius`值。同时,确保`border-collapse`属性设为`separate`,以使边框在单元格之间分离,从而显示圆角效果...
例如,如果我们需要定义整个网页的所有 table 标签的宽度,那么使用 CSS 的通用选择器可能是一个好的选择。但是,如果我们需要定义一个特殊的 table 标签的宽度,那么使用 CSS 的类选择器或 HTML 的 width 属性可能...
在这个名为"一个很好的CSS模块"的压缩包中,我们主要关注的是如何使用CSS来创建一个精美、简约的表格,适合应用于公司内部网站。 表格在网站中扮演着重要的角色,它们常用于展示数据、统计数据或者进行比较。传统的...
在"css3-table-price-hosting1"这个示例中,很可能展示的是如何使用CSS3来美化一个价格或服务托管相关的表格,可能涉及到各种颜色、字体、边框和背景设计,以提升用户对价格计划的可读性和吸引力。通过查看提供的...
根据部分内容,我们可以整理出一个具体的示例代码: ```html <table style="table-layout:fixed; word-break:break-all; word-wrap:break-word"> 这是一段很长的文字,它会被自动换行,即使其中包含英文单词...
在HTML文件`resizable.htm`中,我们需要一个包含数据的`<table>`元素,并为其应用特定的CSS类或ID,以便JavaScript可以识别并应用拖动调整列宽的功能。CSS可能用于设置边框、光标等视觉效果,使用户能清楚地看到可...
CSS里一直有一个让我们头疼的问题,就是创建布局很麻烦。当然,有很多方式,有很多技术都可以创建各种布局,但我们总觉得CSS里应该提供一些新属性,让我们能更好的管理布局。幸运的是,CSS3里提供了一批新的创建列式...
`和具体高度宽度的`div`中,这创建了一个可滚动的容器,而表头则通过CSS固定在顶部。 ```html <div style="overflow-y: scroll; height: 200px; width: 300px;" id="dvBody"> <!-- GridView代码 --> ``` #### 四...
- **`filter`**:这是一个IE浏览器特有的CSS属性,用于实现滤镜效果,如透明度调整等。 - **`alpha(opacity=50)`**:该属性设置元素的透明度,值范围0到100,其中50表示50%的透明度。 #### 三、背景图像设置 ```...
这个项目提供了从头到尾构建一个功能完整登录系统的实例,涵盖了Web开发中前端、后端和数据库的综合应用,对于想要提升Web开发技能的新手来说,是一个很好的实践机会。通过学习这个项目,你可以掌握HTML和CSS的基本...
本文将深入探讨“Ext table布局实例”以及“formpanel的table布局”,帮助开发者更好地理解和运用这两种布局方式。 首先,我们要理解什么是Ext table布局。Ext table布局主要用于显示数据,它基于HTML的`<table>`...
在本项目中,"用HTML+CSS制作微博的静态...总结来说,这个项目展示了如何使用HTML和CSS来构建一个类似微博的静态页面,涵盖了网页的基本结构、响应式设计、样式定制等多个方面,对于初学者来说是一个很好的实践案例。
对于更复杂的需求,可以使用JavaScript库,如jQuery DataTables或Bootstrap的Table插件,它们提供了更强大的功能,如排序、过滤和分页,同时也能很好地处理固定表头和列的问题。 此外,对于响应式设计,还需要考虑...
文件"line.html"很可能是实现这个效果的一个示例代码,通过查看这个文件,你可以更直观地理解上述步骤的实现。在实践中,不断试验和调试将帮助你找到最适合你的需求的解决方案。 总结来说,要在table th中画出交叉...
根据提供的标题、描述以及部分CSS属性内容,我们可以总结出一系列重要的CSS知识点,这些知识点对于学习和掌握CSS至关重要。下面将详细介绍这些属性的功能及其用法。 ### CSS页面布局控制 1. **page-break-after**:...
CSS2是CSS的第二版,它在CSS1的基础上做了很多扩展和改进,使得网页设计更为灵活且功能更强大。 **一、选择器与声明** 1. **基础选择器**:包括类型选择器(如`div`)、ID选择器(如`#myID`)、类选择器(如`....
这个资源对于学习和应用响应式设计以及CSS3特效来说,是一个很好的实例研究。 总之,这个“非常美观的响应式css3表格样式代码”展示了如何利用CSS3的先进特性来提升网页表格的视觉效果和交互性。无论是对初学者还是...
当设置为`fixed`时,表格的宽度由表格的第一个行的列宽决定,这样可以确保表格宽度不会因为内容的多少而产生变化,有利于保持页面布局的一致性。 其次,要让单元格内容在超出宽度时自动换行,需要使用`word-wrap: ...
最后我用的方法是新建一个table,并把源tr克隆到新table中,然后通过对新table定位来实现效果。 用这个方法关键有两点,首先要做一个仿真度尽可能高的tr,还有是要准确的定位,这些请看后面的程序说明。 程序说明 ...