`
atgoingguoat
  • 浏览: 195780 次
  • 性别: Icon_minigender_1
  • 来自: 长沙
社区版块
存档分类
最新评论

HTML常用table样式

    博客分类:
  • js
 
阅读更多

常用table样式,备自己常年复制用。

 

效果图



 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
/************ Table ************/
.xwtable {width: 100%;border-collapse: collapse;border: 1px solid #ccc;}                
.xwtable thead td {font-size: 12px;color: #333333;text-align: center;background: url(table_top.jpg) repeat-x top center;border: 1px solid #ccc; font-weight:bold;}
.xwtable tbody tr {background: #fff;font-size: 12px;color: #666666;}           
.xwtable tbody tr.alt-row {background: #f2f7fc;}               
.xwtable td{line-height:20px;text-align: left;padding:4px 10px 3px 10px;height: 18px;border: 1px solid #ccc;}
-->
</style>
</head>

<body>
<table class="xwtable">
			<thead>
			  <tr>
				<td>条数(可去掉这行)</td>
				<td>内容(可去掉这行)</td>
			  </tr>
			</thead>
			<tbody>
			  <tr>
				<td>第1条</td>
				<td>内容内容内容</td>
			  </tr>
			  <tr>
				<td>第2条</td>
				<td>内容内容内容内容</td>
			  </tr>
			  <tr>
				<td>&nbsp;</td>
				<td>&nbsp;</td>
			  </tr>
			  <tr>
				<td>&nbsp;</td>
				<td>&nbsp;</td>
			  </tr>
			  <tr>
				<td>&nbsp;</td>
				<td>&nbsp;</td>
			  </tr>
			</tbody>
		  </table>
</body>
</html>

 

  • 大小: 35.3 KB
  • table.rar (3.5 KB)
  • 描述: 源代码包
  • 下载次数: 29
0
0
分享到:
评论

相关推荐

    html,table常用样式

    根据给定的信息,本文将详细解释两种HTML表格的样式:单像素边框CSS表格与带背景图的CSS样式表格,并简要介绍一种自动换整行颜色的CSS样式表格(需要用到JavaScript)。 ### 一、单像素边框CSS表格 #### 1.1 CSS...

    Table常用的几种CSS样式

    以下是对"Table常用的几种CSS样式"的详细阐述。 1. **边框样式**: - `border-collapse`: 控制表格边框是否合并。`collapse`将合并相邻单元格的边框,`separate`则保持边框独立。 - `border-spacing`: 设置或获取...

    HTML Table 漂亮的CSS

    在网页设计中,HTML表格(Table)是一种常用的数据展示方式,而通过应用合适的CSS(Cascading Style Sheets)样式,我们可以让这些表格看起来更加美观、专业。本资源包"HTML Table 漂亮的CSS"提供了多种独立的CSS...

    HTML固定Table标题行的四种方法

    在网页设计中,HTML表格(Table)是一种常用的数据展示方式,但当表格内容过多时,滚动查看会使得标题行消失,影响用户阅读。为解决这一问题,开发者通常采用JavaScript来实现Table标题行的固定,使其在滚动时始终...

    html Table 表头固定的实现

    在进行HTML页面设计时,表格(Table)是经常使用的组件之一。尤其是在需要展示数据集的场景中,表格因为其结构化的特性,可以清晰地显示数据。但有时候,我们会遇到一个问题,即当表格数据量较大时,随着页面向下...

    table 细线 样式

    要在HTML表格中实现细线样式,最常用的方法是通过CSS来设置表格及单元格的样式。 - **`border-collapse`**:此属性决定了表格边框的绘制方式。当其值设为`collapse`时,相邻单元格的边框会合并成一条边框。 - **`...

    html table 固定表头和列

    HTML表格是网页设计中常用的一种元素,用于展示结构化数据。在处理大量数据时,保持表头和列的可见性对于用户来说是非常重要的,因为它们提供了数据的上下文信息。"html table 固定表头和列"这个主题就是关于如何在...

    HTML Table固定表头完美实现

    在网页设计中,HTML表格(Table)是一种常用的数据展示方式,尤其在处理结构化数据时。然而,当表格内容较多,需要滚动查看时,表头(Header)往往随着滚动消失,给用户阅读带来不便。本篇文章将探讨如何通过HTML、...

    jQuery插件冻结行列、固定列固定行,html、table实现

    在网页开发中,数据展示往往是不可或缺的部分,特别是当数据量较大时,表格(Table)成为常用的展示工具。然而,当表格内容过多,滚动时容易丢失头部和左侧的列标题,给用户阅读和理解带来困扰。为了解决这个问题,...

    好看的TABLE样式

    在压缩包“好看漂亮的Table样式”中,可能包含了一些预设的CSS样式文件和示例HTML文件,你可以参考这些示例来快速应用到自己的项目中,进一步定制符合自己需求的表格样式。记住,好的前端设计应兼顾视觉效果和功能性...

    table2Excel.rar

    Table2Excel.js是一个常用的JavaScript库,它允许开发者将HTML表格转换为Excel文件,提供了一种便捷的数据导出解决方案。然而,在实际应用中,尤其是在兼容性要求较高的IE浏览器中,可能会遇到一些问题,如“table[0...

    bootstrap-table-export.js和tableExport.js

    Bootstrap表格是前端开发中常用的组件,它为网页中的数据展示提供了美观且响应式的解决方案。而“bootstrap-table-export.js”和“tableExport.js”是针对Bootstrap表格的导出插件,它们扩展了表格的功能,允许用户...

    html标记大全 有marquee,table,form等最常用标记。

    本文将基于提供的文件信息,详细介绍几个常用的HTML标记及其属性,帮助读者更好地理解和使用这些标记。 #### 1. 批注标记:`&lt;!----&gt;` 批注标记用于添加对代码的解释或备注,它不会显示在最终的网页上。 ```html &lt;!-...

    基于jquery的固定html table表头/列头插件

    在网页设计中,数据展示往往是不可或缺的部分,而HTML表格(Table)是常用的数据展示工具。然而,当表格数据过多,需要滚动浏览时,表头(thead)和列头(th)随着滚动消失,使得用户难以对应数据列,降低了用户体验...

    HTML常用标签代码

    在本资源中,我们看到的"HTML常用标签代码"显然是一个帮助初学者或开发者学习和练习HTML标签的资料。下面将详细介绍一些常见的HTML标签及其用法。 1. `&lt;html&gt;`: 这是每个HTML文档的根元素,包含整个网页的代码。...

    table表格内容上下移动的三种实现方法

    在网页设计中,HTML表格(Table)是一种常用的数据展示方式,有时我们需要实现表格内容的上下移动功能,以满足用户交互需求或数据操作便利性。本篇文章将详细讲解三种实现HTML表格内容上下移动的方法。 方法一:...

    HTML常用标记 HTML常用标记

    在HTML中,常用的标记是构建网页内容和样式的基石。 首先,了解HTML的结构至关重要。一个基本的HTML文档由三大部分构成:`&lt;HTML&gt;`、`&lt;HEAD&gt;`和`&lt;BODY&gt;`。`&lt;HTML&gt;`标记是整个文档的根元素,它定义了文档的开始和结束...

    table里面获取所有元素

    在HTML中,`&lt;table&gt;`元素是创建表格的基础,而获取表格中的所有元素则是进行数据操作、事件绑定或者样式修改等任务时常常遇到的需求。这篇博客“table里面获取所有元素”可能探讨了如何在JavaScript或相关的前端技术...

    【ASP.NET编程知识】把字符串转为HtmlTable演示动画.docx

    HtmlTable是ASP.NET中一种常用的控件,用于在Web页面上展示表格数据。它可以自动将数据绑定到表格中,并提供了许多有用的属性和方法来自定义表格的样式和行为。 二、将字符串转换为HtmlTable 在ASP.NET中,将字符...

Global site tag (gtag.js) - Google Analytics