表格标签

一、<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>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</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">&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
</tr>
<tr>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
</tr>

   上段代码表示4行4列的表格里,合并第2/3行的第1列。第2行中多出rowspan="2",表示合并了2行,第3行相应的显示少了1个单元格。

6.colspan 合并单元格(合并列)   列的合并和行的合并原理一样。

四、<th>做表头的(第一行),一般不会用到。

表格标签(table、行、列、表头)的更多相关文章

  1. 透明、圆角、阴影效果、背景色渐变、<a></a>去外层虚线、!!!表格标签<table>

    表格标签 <table> 代表表格 width:指表格的宽度           一种是像素 (浏览器缩小的时候出现滚动条)           一种是百分比(跟着浏览器的大小而大小) b ...

  2. 前端 HTML body标签相关内容 常用标签 表格标签 table

    表格标签 table 表格由<table> 标签来定义.每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由<td>标签定义).字母 td 指表 ...

  3. 关于html与css的标签及属性(text文本属性、背景background属性、表格标签table、列表、)

    text文本属性1.颜色 colorcolor:red: 2.文本缩进text-indant属性值 num+px text-indant:10px:3.文本修饰 text-decoration属性值: ...

  4. HTML+css基础 表格标签table Table标签属性 td标签属性

    表格标签table:   他是由行与列构成,最小单位是单元格. 行标签  <tr></tr> 单元格标签<td></td> Table标签属性: Bor ...

  5. html5 表格标签 table tr td

      最重要的三个 <table>     表格声明标签 属性: boarder    边框粗细 style    可配合css 使用 <tr>    行标签 table row ...

  6. 冻结 锁定 固定 行 列 表头 抬头 html table jquery 全兼容常见浏览器

    转:http://www.cnblogs.com/sorex/archive/2011/06/30/2093499.html <!DOCTYPE html PUBLIC "-//W3C ...

  7. HTML的表格标签

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. HTML常用标签与表格标签

    超链接标签: <a href="超链接地址" target="_blank">超链接的文字</a> _blank或new是在新网页中打开 ...

  9. PHP入门 - - 06-->HTML的表格标签

    表格标签<table> <table>的属性: Align: left, center, right          (表格的)位置 Border:              ...

  10. 一天搞定CSS:表格(table)--19

    1.表格标签 表格标签的嵌套关系 <table> <!--表格头--> <thead> <!--表格行--> <tr> <!--表格列 ...

随机推荐

  1. Nodejs学习笔记(一)--- 操作Mysql数据库

    对于一门语言的学习,我个人觉得最好的方式就是通过一个项目来展示,所以从基本的一些模块去了解是最好的方式对于Mysql怎么去链接数据库这个我是在网上找到的(其实一直想找官方文档的,发现没有它的踪迹,(后 ...

  2. JavaScript与OC的交互-WebViewJavascriptBridge

    WebViewJavascriptBridge实现了在使用UIWebView时JS与ios 的Objective-C nativecode之间的互相调用, 支持的功能有消息发送.接收.消息处理器的注册 ...

  3. TCP系列48—拥塞控制—11、FRTO拥塞撤销

    一.概述 FRTO虚假超时重传检测我们之前重传章节的文章已经介绍过了,这里不再重复介绍,针对后面的示例在说明两点 1.FRTO只能用于虚假超时重传的探测,不能用于虚假快速重传的探测. 2.延迟ER重传 ...

  4. Markdown github 风格语法

    某些效果cnblog无法支持,见 https://github.com/tanghammer/note/blob/master/Markdown%20github%E9%A3%8E%E6%A0%BC% ...

  5. 敏捷冲刺DAY5

    一. 每日会议 1. 照片 2. 昨日完成工作 发布和提供需求功能的实现 用户修改自己的信息 用户界面设计 管理员界面设计 3. 今日完成工作 4. 工作中遇到的困难 1.设置的背景无法显示. 2.一 ...

  6. 关于初装kali linux 2.0时DEB文件安装失败的问题

    kali linux 是一个基于debian 的linux发行版本,支持deb文件格式的图形化安装. 刚装上kali linux时安装程序总是失败,提示处理时错误. 经过一番爬贴,是软件源的原因,解决 ...

  7. spring学习12 -Spring 框架模块以及面试常见问题注解等

    以下为spring常见面试问题: 1.Spring 框架中都用到了哪些设计模式? Spring框架中使用到了大量的设计模式,下面列举了比较有代表性的: 代理模式—在AOP和remoting中被用的比较 ...

  8. codeforces 1023 D. Array Restoration 并查集

    D. Array Restoration time limit per test 1 second memory limit per test 256 megabytes input standard ...

  9. 【HLSDK系列】HL引擎入门篇

    如果你打算拿HL的源码(也就是HLSDK)来改出一个自己的游戏,那你就非常有必要理解一些HL引擎的工作方式. HL引擎分成两个部分,服务端和客户端.服务端管理所有玩家的状态和游戏规则,客户端负责显示U ...

  10. BZOJ4896 THUSC2016补退选(trie)

    字符串扔进trie,vector记录每个前缀出现次数的最大值的更新记录即可. #include<iostream> #include<cstdio> #include<c ...