表格标签(table、行、列、表头)
表格标签
一、<table>
<table>代表表格标签。 <table></table>
1.width 表示表格宽度,宽度表达方式有像素和百分比两种。网页设计时如果按照像素来设计网页宽度,当网页窗口缩小时,网页大小不会随着窗口的缩小而变化,而会出现上下和左右拉伸条,以观看网站的全部内容。网站设计时如果按照百分比设计网页宽度,网页全局会随着可视窗口的变化而变化。
<table width="100%" >表示此表格宽度以百分比表达,宽度100%表示网页有多宽此表格就有多宽。
2.border 表示边框粗细 <table border="0"> 表示边框宽度为零,也可理解为没有边框。
3.cellspacing 单元格的边距 <table cellspacing="0" > 边距是单元格里单元格内容与单元格外框之间的距离,如果不为0,则单元格里的内容不会触碰到单元格的边,会保持一定距离
4.cellpadding 单元格间距 <table cellpadding="0">间距是单元格和单元格之间的距离,是单元格距离四周的单元格的垂直距离。
5.bordercolor 边框颜色 <table bordercolor="#33FFCC"> 边框颜色是单元格边框的颜色
二、<tr> 代表行
<table width="100%" border="0" cellspacing="0" cellpadding="0" bordercolor="#33FFCC">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr
<table>
表示1个表格有1行4列
三、<td> 代表单元格
1.width 单元格的宽度
2.height 单元格的高度
3.align 水平对齐方式 ①left左对齐 ②right右对齐 ③center居中对齐
4.valign 垂直对齐方式 ①top靠上 ②bottom靠下 ③middle中间 垂直对齐方式的居中和水平对齐方式的居中不一样。
5.rowspan 合并单元格(合并行)
<tr>
<td rowspan="2"> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
上段代码表示4行4列的表格里,合并第2/3行的第1列。第2行中多出rowspan="2",表示合并了2行,第3行相应的显示少了1个单元格。
6.colspan 合并单元格(合并列) 列的合并和行的合并原理一样。
四、<th>做表头的(第一行),一般不会用到。
表格标签(table、行、列、表头)的更多相关文章
- 透明、圆角、阴影效果、背景色渐变、<a></a>去外层虚线、!!!表格标签<table>
表格标签 <table> 代表表格 width:指表格的宽度 一种是像素 (浏览器缩小的时候出现滚动条) 一种是百分比(跟着浏览器的大小而大小) b ...
- 前端 HTML body标签相关内容 常用标签 表格标签 table
表格标签 table 表格由<table> 标签来定义.每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由<td>标签定义).字母 td 指表 ...
- 关于html与css的标签及属性(text文本属性、背景background属性、表格标签table、列表、)
text文本属性1.颜色 colorcolor:red: 2.文本缩进text-indant属性值 num+px text-indant:10px:3.文本修饰 text-decoration属性值: ...
- HTML+css基础 表格标签table Table标签属性 td标签属性
表格标签table: 他是由行与列构成,最小单位是单元格. 行标签 <tr></tr> 单元格标签<td></td> Table标签属性: Bor ...
- html5 表格标签 table tr td
最重要的三个 <table> 表格声明标签 属性: boarder 边框粗细 style 可配合css 使用 <tr> 行标签 table row ...
- 冻结 锁定 固定 行 列 表头 抬头 html table jquery 全兼容常见浏览器
转:http://www.cnblogs.com/sorex/archive/2011/06/30/2093499.html <!DOCTYPE html PUBLIC "-//W3C ...
- HTML的表格标签
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- HTML常用标签与表格标签
超链接标签: <a href="超链接地址" target="_blank">超链接的文字</a> _blank或new是在新网页中打开 ...
- PHP入门 - - 06-->HTML的表格标签
表格标签<table> <table>的属性: Align: left, center, right (表格的)位置 Border: ...
- 一天搞定CSS:表格(table)--19
1.表格标签 表格标签的嵌套关系 <table> <!--表格头--> <thead> <!--表格行--> <tr> <!--表格列 ...
随机推荐
- Nodejs学习笔记(一)--- 操作Mysql数据库
对于一门语言的学习,我个人觉得最好的方式就是通过一个项目来展示,所以从基本的一些模块去了解是最好的方式对于Mysql怎么去链接数据库这个我是在网上找到的(其实一直想找官方文档的,发现没有它的踪迹,(后 ...
- JavaScript与OC的交互-WebViewJavascriptBridge
WebViewJavascriptBridge实现了在使用UIWebView时JS与ios 的Objective-C nativecode之间的互相调用, 支持的功能有消息发送.接收.消息处理器的注册 ...
- TCP系列48—拥塞控制—11、FRTO拥塞撤销
一.概述 FRTO虚假超时重传检测我们之前重传章节的文章已经介绍过了,这里不再重复介绍,针对后面的示例在说明两点 1.FRTO只能用于虚假超时重传的探测,不能用于虚假快速重传的探测. 2.延迟ER重传 ...
- Markdown github 风格语法
某些效果cnblog无法支持,见 https://github.com/tanghammer/note/blob/master/Markdown%20github%E9%A3%8E%E6%A0%BC% ...
- 敏捷冲刺DAY5
一. 每日会议 1. 照片 2. 昨日完成工作 发布和提供需求功能的实现 用户修改自己的信息 用户界面设计 管理员界面设计 3. 今日完成工作 4. 工作中遇到的困难 1.设置的背景无法显示. 2.一 ...
- 关于初装kali linux 2.0时DEB文件安装失败的问题
kali linux 是一个基于debian 的linux发行版本,支持deb文件格式的图形化安装. 刚装上kali linux时安装程序总是失败,提示处理时错误. 经过一番爬贴,是软件源的原因,解决 ...
- spring学习12 -Spring 框架模块以及面试常见问题注解等
以下为spring常见面试问题: 1.Spring 框架中都用到了哪些设计模式? Spring框架中使用到了大量的设计模式,下面列举了比较有代表性的: 代理模式—在AOP和remoting中被用的比较 ...
- codeforces 1023 D. Array Restoration 并查集
D. Array Restoration time limit per test 1 second memory limit per test 256 megabytes input standard ...
- 【HLSDK系列】HL引擎入门篇
如果你打算拿HL的源码(也就是HLSDK)来改出一个自己的游戏,那你就非常有必要理解一些HL引擎的工作方式. HL引擎分成两个部分,服务端和客户端.服务端管理所有玩家的状态和游戏规则,客户端负责显示U ...
- BZOJ4896 THUSC2016补退选(trie)
字符串扔进trie,vector记录每个前缀出现次数的最大值的更新记录即可. #include<iostream> #include<cstdio> #include<c ...