<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. SharedPreferences解析

    一.概述 SharedPreferences(简称SP)是Android中很常用的数据存储方式,SP采用key-value(键值对)形式,主要用于轻量级的数据存储,尤其适合保存应用的配置参数,但不建议 ...

  2. [Postman]历史(8)

    邮递员将您发送的所有请求存储在左侧边栏的“历史记录”视图中.您可以使用历史记录快速尝试各种请求,而不必浪费时间从头开始构建请求.您还可以通过单击请求名称来加载先前的请求. 如果您创建了一个帐户并登录P ...

  3. Oracle和Mysql语法异同整理笔记

    目录 (1) 模糊匹配 (2) 删除数据 (3) 时间函数 (4) 关键字问题 (5) 递归查询 (6) 排序问题 (7) 空值返回0 (8) 取最大值 (9) 列转换函数 (10) 类型转行函数 @ ...

  4. Python find函数用法和概念

    概念: Python find() 方法检测字符串中是否包含子字符串 str ,如果指定 beg(开始) 和 end(结束) 范围,则检查是否包含在指定范围内,如果包含子字符串返回开始的索引值,否则返 ...

  5. js代码跑马灯效果-----轮播图字效果!

    文字元素: <p id="yc-msg">你有本事来打我呀!</p> js执行代码: function ycMsg() { // 获取 标签 var pOb ...

  6. Vue SSR不可不知的问题

    Vue SSR不可不知的问题 本文主要介绍Vue SSR(vue服务端渲染)的应用场景,开发中容易遇到的一些问题,提升ssr性能的方法,以及ssr的安全性问题. ssr的应用场景 1.SEO需求 SE ...

  7. thymeleaf-在font标签中的使用

    <font color="red" th:text="开始了">font外</font>页面显示红色字体 开始了 (同时存在,则前者覆盖 ...

  8. eos开发(二)使用cleos命令行客户端操作EOS(钱包wallet基础操作)

    不知道下边这一段英文你们是不是能看懂,如果看不懂那就算了,我就是转过来随便看看的. 总之你记住nodeos.cleos和keosd这三个工程十分重要就行了,回头咱们的研究都从这三个工程杀进去. EOS ...

  9. js动态创建表单数据

    var formData = new FormData(); formData.append("file",fileList[i]); formData.append(" ...

  10. maven下载其源代码包并关联

    有时我们的源码可能会失去关联,然后需要我们在当前项目中(含有pom.xml文件的那个目录)按住shift然后在当前项目文件夹空白处右键,选择在此处打开命令输入一下命令: 1. 下载所有在POM中的的s ...