zoukankan      html  css  js  c++  java
  • 用css样式,为表格加入边框

    Table 表格在没有添加 css 样式之前,是没有边框的。这样不便于我们后期合并单元格知识点的讲解,所以在这一节中我们为表格添加一些样式,为它添加边框。

    在右侧代码编辑器中添加如下代码:

    <style type="text/css">
    table tr td,th{border:1px solid #000;}
    </style>

    上述代码是用 css 样式代码(后面章节会详细讲解),为thtd单元格添加粗细为一个像素的黑色边框。

    结果窗口显示出结果样式:

    实例:

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>为表格添加边框</title>
    <style type="text/css">
    table tr td,th{border:1px solid #000;}
    </style>
    </head>
    
    <body>
    <table summary="">
      <tr>
        <th>班级</th>
        <th>学生数</th>
        <th>平均成绩</th>
      </tr>
      <tr>
        <td>一班</td>
        <td>30</td>
        <td>89</td>
      </tr>
      <tr>
        <td>二班</td>
        <td>35</td>
        <td>85</td>
      </tr>
      <tr>
        <td>三班</td>
        <td>32</td>
        <td>80</td>
      </tr>

    浏览器输出:

    班级学生数平均成绩
    一班 30 89
    二班 35 85
    三班 32 80
  • 相关阅读:
    阴影及定位
    选择器高级、样式及布局
    css的导入与基础选择器
    html知识
    ORM
    python实现进度条
    MySQL单表查询
    一、HTTP
    mysql4
    练习——MySQL
  • 原文地址:https://www.cnblogs.com/iBoundary/p/11418254.html
Copyright © 2011-2022 走看看