快速制作一个有列表标签的网页

最新推荐文章于 2022-09-03 21:39:24 发布

爷傲~奈我何

最新推荐文章于 2022-09-03 21:39:24 发布

阅读量617

点赞数 1

本文链接：https://blog.csdn.net/yeao_naiwohe/article/details/117460648

版权

本文介绍如何利用HTML的列表和表格标签快速制作一个网页。通过掌握这两种基本标签，可以创建出一个简单的带有列表展示的网页。代码中已添加注释，方便初学者理解。

摘要由CSDN通过智能技术生成

制作要求

1、掌握HTML列表标签

2、掌握HTML表格标签

接下来就开始制作

具体代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>列表表格</title>
</head>
<body>
    <font size="5" > 搜索引擎排名 </font><br><!--设置主要字体的大小-->
    <ol type="1" ><!--有序列表标签并设置属性（按1、2、3、···排序）-->
    <li>Google</li><!--有序列表列表项-->
    <li>Baidu</li>
    <li>Bing</li>
    <li>Sogou</li>
    </ol>
    <font size="5" > 软件编程语言 </font><br>
    <ul type="solid"><!--无序列表（type 的属性值有 circle,disc,square 含义分别为：空心圆，实心圆和实心正方形）-->
    <li>Java</li><!--无序列表列表项-->
    <li>C++</li>
    <li>Python</li>
    <li>JavaScript</li>
    </ul>
    <font size="5" > 健康食品 </font><br>
    <dl><!--建立定义列表-->
        <dt>水果</dt> <!--<dt>和</dt>之间就是要解释的名称-->
            <dd>苹果</dd><!--<dd>和</dd>之间则是该名词的具体解释-->
            <dd>香蕉</dd>
        <dt>蔬菜</dt> 
            <dd>西兰花</dd>
            <dd>菠菜</dd>
    </dl><!--<dl>标签和</dl>标签分别定义了定义列表的开始和范围-->

    <table border="2" ><!--table：表格标签（属性：border：边框线大小 wi