HTML 列表和表格

HTML 是用来描述网页的一种语言。

HTML 指的是超文本标记语言 (Hyper Text Markup Language)

HTML 不是一种编程语言,而是一种标记语言 (markup language)

标记语言是一套标记标签 (markup tag)

HTML 使用标记标签来描述网页

在上图中展示了HTML列表的应用,其中包含了两种不同的列表方式:有序列表和无序列表,列表创建代码如下:

 无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。无序列表使用<ul >标签。每个列表项使用<li>

有序列表也是一列项目,列表项目使用数字自动进行标记。有序列表使用<ol>标签定义。每个列表项使用<li>标签,每一个列表项依次从1开始列表

ul与ol前的符号是可以修改的。只需要修改它们的type值。

ul的type属性有:disc—实心圆(默认)、circle—空心圆、square—实心方块

ol的type属性有:1—数字(默认)、a—小写字母、A—大写字母、i—小写希腊字母、I—大写希腊字母。

通过CSS也可以在将它们前的符号改为图片,这样列表显示就会更美观了


上图是使用HTML中的table标签创建的表格,实现代码如下:

<table border="1">

        <caption>购物车</caption>

        <tr>

                <th rowspan="2">名称</th>

                <th colspan="2">2018-01-09</th>

                <th rowspan="2">小计</th>

        </tr>

        <tr>

                <th>重量</th>

                <th>单价</th>

        </tr>

    <tr>

            <th>苹果</th>

            <td>3公斤</td>

            <td>5元/公斤</td>

            <td>15元</td>

    </tr>

    <tr>

            <th>香蕉</th>

            <td>2公斤</td>

            <td>6元/公斤<td>

            <td>12元</td>

   </tr>

    <tr>

            <th colspan="3">总价</th>

            <td>27元</td>

    </tr>

</table>

<caption>标签用于定义表格的标题,<th>标签为表格的表头,<tr></tr>为表格行,<td></td>为表格列,rowspan, colspan分别用于表示合并行,和并列,border 定义了表格边框,若无此属性,则表格默认不显示边框,

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,310评论 1 41
  • 0.B/S结构 浏览器服务器模式,web浏览器是客户端最主要的应用软件.将客户端使用web进行统一,系统功能实现集...
    liusong007阅读 1,082评论 0 1
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,860评论 18 139
  • 我 幼时经常萌生,我,是谁,是何等物种,是谁将我带到这个世界?这个世界是...
    安静的乖乖妈阅读 235评论 0 2
  • 从早上开始,看早读,抓迟到,联系没来的学生家长。 运气好的话,还有学生家长会打电话来跟你唠嗑,自己孩子的问题重复个...
    络石花阅读 156评论 3 6