<html>
 <head>
  <title>表格标签学习</title>
  <meta charset="utf-8"/>
  <!--
   表格标签学习:
   table:声明一个表格
    tr:声明一行,设置行高及行所有单元格的高度。
     th:声明一个单元格,表头格,默认加粗居中显示
     td:声明一个单元格,默认居左显示原始数据
    注意:
     行高即该行所有单元格的高度
     单元格的宽度即列宽
   属性:
    border:给表格添加边框
    width:设置表格的宽度
    height:设置表格的高度
    cellpadding:设置内容居边框的距离
    cellspacing:设置边框大小
   特点 :
    默认根据数据的多少进行表格的大小显示
  单元格的合并:
   第一步:
    首先确保表格是一个规整的表格
   第二步:
    根据要合并的单元格,找到其所在的源码位置
   第三步:
    行合并:在要合并的单元格中第一个单元格上使用属性rowspan="要合并的单元格的个数",并删除其他要合并的单元格完成合并
    列合并:在要合并的单元格中的任意一个上使用属性colspan="要合并的单元格的个数",并删除其他要合并的单元格
  -->
 </head>
 <body>
  <h3>表格标签学习</h3>
  <hr />
  <h3>表格标签的常用属性及设置学习</h3>
  <table border="1px" cellpadding="10px" cellspacing="10px">
    <tr height="100px">
     <th width="100px">科目</th>
     <th width="100px">分数</th>
     <th width="100px">级别</th>
     <th width="150px">说明</th>
    </tr>
    <tr height="100px">
     <td>java</td>
     <td>100</td>
     <td>8</td>
     <td>面向对象的语言</td>
    </tr>
    <tr height="100px">
     <td>C语言</td>
     <td>100</td>
     <td>8</td>
     <td>面向过程的语言</td>
    </tr>
  </table>
  <hr />
  <h4>单元格的合并学习:</h4>
  <table border="1px" cellspacing="0px">
   <tr height="35px">
    <td width="100px"></td>
    <td width="100px"></td>
    <td width="100px"></td>
    <td width="100px"></td>
    <td width="100px"></td>
   </tr>
   <tr height="35px">
    <td colspan="2"></td>
    <td></td>
    <td></td>
    <td></td>
   </tr>
   <tr height="35px">
    <td></td>
    <td></td>
    <td></td>
    <td rowspan="2"></td>
    <td></td>
   </tr>
   <tr height="35px">
    <td></td>
    <td></td>
    <td></td>
    <td></td>
   </tr>
  </table>
 </body>
</html>

06-HTML-表格标签的更多相关文章

  1. [19/05/16-星期四] HTML_body标签(表格标签)

    一.概念 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...

  2. H5 表格标签的其它标签

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  3. H5 表格标签基本使用

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

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

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

  5. 9月6日表格标签(table、行、列、表头)(补)

    一.<table> <table>代表表格标签.   <table></table> 1.width  表示表格宽度,宽度表达方式有像素和百分比两种.网 ...

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

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

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

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

  8. HTML的表格标签

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

  9. HTML表格标签

    table标签的用途: 在表格中放图片,或用于布局(已经淘汰掉了),存放数据 table制作过程: 1.先分析表格有多少行 2.分析有多少列 3.做好表格的基本之后再添加表格需要的一些属性 table ...

  10. html系列教程--span style 及表格标签 title video

    <span> 标签:非块状元素,用于文本描述 <style> 标签:内联样式表标签定义样式信息,必须写明type类型为text/css,建议写在head中,不是必须 demo: ...

随机推荐

  1. Javascript高级编程学习笔记(44)—— 动态样式

    动态样式 动态样式和昨天的动态脚本一样,都是一种动态引入外部样式(脚本的方式) 由于样式是由 link 元素引入的,所以动态样式自然也就是动态生成link元素插入文档的方式 不过和动态脚本不同的是,动 ...

  2. 每天学点SpringCloud(十四):Zipkin使用SpringCloud Stream以及Elasticsearch

    在前面的文章中,我们已经成功的使用Zipkin收集了项目的调用链日志.但是呢,由于我们收集链路信息时采用的是http请求方式收集的,而且链路信息没有进行保存,ZipkinServer一旦重启后就会所有 ...

  3. Cocos2d-x环境配置步骤

    Cocos2d-x环境配置: (1)安装Visual Studio 2013 软件安装包为:VS2013_RTM_ULT_CHS.iso文件,将其解压后可以直接安装,也可以使用虚拟光驱等软件进行安装. ...

  4. json模块及其API

    模块:json 所包含API列表: json.dumps : 将python对象转换成json格式 json.loads : 将json格式字符串转换为python对象 ——————————————— ...

  5. Axure安装、破解、汉化全套

    最近公司准备使用敏捷开发流程,然后刚好需要Axure这个软件,就去找了些资源分享给大家,希望对大家有所帮助: 全套安装,破解,汉化下载地址: 链接: https://pan.baidu.com/s/1 ...

  6. JAVA面试题-数组字符串基础

    1.大写的Integer和String是可变类还是不可变类?怎么定义不可变类?不可变.用final关键字,如public final class Integer extends Number 2.比较 ...

  7. C# 请求接口返回中文乱码→???

    在工作过程中,调用第三方接口出现当返回的数据是中文的时候,中文数据便会变成 这样??? 迷~ ,一开始我以为是发送成功后接收字符编码是不是不对,在换过UTF-8,Unicode,...都是不行. 最后 ...

  8. 关于 Spring Security OAuth2 中 CORS 跨域问题

    CORS 是一个 W3C 标准,全称是”跨域资源共享”(Cross-origin resource sharing).它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了 AJA ...

  9. 全网最全的Windows下Anaconda2 / Anaconda3里正确下载安装OpenCV(离线方式和在线方式)(图文详解)

    不多说,直接上干货! 说明: Anaconda2-5.0.0-Windows-x86_64.exe安装下来,默认的Python2.7 Anaconda3-4.2.0-Windows-x86_64.ex ...

  10. vue-08-axios-get-post-跨域

    1, 安装 cnpm install axios --save 2, 在main.js中引入 import Axios from 'axios' // 挂在在Vue上Vue.prototype.$ax ...