【丛林】HTML Table 表格浅谈(边框、隔行变色
此例子已经包含本文大部分内容,请对照参考。查看代码 》
定义和用法
table标签定义 HTML 表格。
创建表格的四要素:table、tr、th、td
<table>
整个表格以<table>标记开始、</table>标记结束。
<tr>
Table row。表格的一行,有几对 tr 表格就有几行。
<td>
Table data。表格的一个单元格,一行中包含几对 td ,一行中就有几列。
<th>
Table head。表格的头部的一个单元格,表格表头。
额外元素
<tbody>、<thead>、<tfoot>
表格结构,如果不加<thead> <tbody> <tfooter> , 表格将在加载完后才显示。加上这些, tbody包含行的内容优先显示,不必等待表格结束后再显示。
同时,如果表格很长,用tbody分段,可以一部分一部分地显示。
(通俗理解 table 可以按结构一块块的显示,不用等整个表格加载完后显示。)
<caption>
表格标题
属性
border
表格边框的宽度。
建议设置为 0 后自行 CSS 添加边框样式。
cellpadding
表格单元边界与单元内容之间的间距(内边距)。
建议设置为 0 后自行 CSS 添加内边距样式。
cellspacing
单元格之间的间距。
实例
使用CSS3实现表格隔行变色
例子代码更加直观易懂 查看代码 》
使用 CSS3的 :nth-child(n) 伪类选择器可以实现表格隔行变色的效果。
n 可填写 odd、even或任意数字,分别代表奇数行/列、偶数行/列或指定行/列
【丛林】HTML Table 表格浅谈(边框、隔行变色的更多相关文章
- [转]CSS如何设置html table表格边框样式
原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...
- 隔行变色---bai
<!DOCTYPE html> <html> <style> .mousein { background-color:blue; cursor: pointer; ...
- 浅谈如何正确给table加边框
一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 <style> table,table tr th, table tr td { border:1px so ...
- table 表格隔行换色实现
table 表格隔行换色实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...
- table表格设置边框线为单实线
设置table表格边框为单实线的方法有两种 第一种方法就是利用table标签cellspacing=0属性来实现,cellspacing是内边框和外边框的距离,这种方法实现的看起来是单实线,其实是内边 ...
- 表格(Table)隔行变色
在ASP.NET的Repeater控件,实现隔行变色,是极简单的事情.因为它有ListItemType.Item和ListItemType.AlternatingItem模版.如果在普通的表格(Tab ...
- table 表格 细边框 最简单样式
table 表格细边框的效果实现方法虽然不难,但网上简单有效的方法却很少,在此记录一下 css 样式 /** table 细边框 **/ table{border-collapse: collapse ...
- BootStrap的table表格,栅格系统,form表单的样式
BootStrap BootStrap的简介 1. 什么是Bootstrap 由两个前端设计师开发的一个前端的框架(Html,css,js) 简化了程序员写css的代码 2. 为什么使用B ...
- 前端性能优化--为什么DOM操作慢? 浅谈DOM的操作以及性能优化问题-重绘重排 为什么要减少DOM操作 为什么要减少操作DOM
前端性能优化--为什么DOM操作慢? 作为一个前端,不能不考虑性能问题.对于大多数前端来说,性能优化的方法可能包括以下这些: 减少HTTP请求(合并css.js,雪碧图/base64图片) 压缩( ...
随机推荐
- cts-on-gsi测试流程
测试前提: 1.发货user版本 2.selinux:Enable 3.连接ADB,stay awake 4.烧录XXX申请的key 5.外网环境(ipv6) ATV9测试准备(正常准备环境+fast ...
- 京东商品评论的分类预测与LSA、LDA建模
(一)数据准备 1.爬取京东自营店kindle阅读器的评价数据,对数据进行预处理,使用机器学习算法对评价文本进行舆情分析,预测某用户对本商品的评价是好评还是差评.通过数据分析与模型分析,推测出不同型号 ...
- lLinux 下 Stress 压力测试工具
作者信息 邮箱:sijiayong000@163.com Q Q:601566386 Stress是什么 stress是一个linux下的压力测试工具,专门为那些想要测试自己的系统,完全高负荷和监督这 ...
- 爬取王垠的博客并生成pdf
尚未完善,有待改进 #!/usr/bin/env python3 # -*- coding: utf-8 -*- __author__ = 'jiangwenwen' import pdfkit im ...
- CentOS删除Applications中的菜单项
有时候会错误的安装一些软件,可能安装被不成功,但是在左上角的Applications菜单中还是会显示出来,让人很不爽. 现在介绍一个删除掉CentOS Applications中菜单项的方法: 1.安 ...
- 记一次用Linux curl命令获取Django url返回值异常的问题
问题描述: curl 检测 URL 返回值以判断服务器是否正常 原命令:curl -I -m 10 -o /dev/null -s -w %{http_code} --insecure $url 问题 ...
- Solr的学习使用之(二)schema.xml等配置文件的解析
上一篇文章已经讲解了如何部署Solr,部署是部署完了,可是总觉得心里空空的,没底,里面有N多配置文件,比如schema.xml.solrConfig.xml.solr.xml and so on……都 ...
- 屏蔽命令任何输出的:>/dev/null 2>&1
- python3使用print打印带颜色的字符串
一.实现过程 终端的字符颜色是用转义序列控制的,是文本模式下的系统显示功能,和具体的语言无关 转义序列是以ESC开头,即用\033来完成(ESC的ASCII码用十进制表示是27,用八进制表示就是033 ...
- tensorflow教程:tf.contrib.rnn.DropoutWrapper
tf.contrib.rnn.DropoutWrapper Defined in tensorflow/python/ops/rnn_cell_impl.py. def __init__(self, ...