HTML系列之List和Table 超链接 Form(三)

最新推荐文章于 2024-09-29 23:49:31 发布

JM_杰

最新推荐文章于 2024-09-29 23:49:31 发布

阅读量870

点赞数

CC 4.0 BY-SA版权

分类专栏： html 文章标签： html 标签

本文链接：https://blog.youkuaiyun.com/dapyandxpy/article/details/73135415

html 专栏收录该内容

14 篇文章

订阅专栏

本文详细介绍了HTML中的基本元素，包括列表标签（无序列表ul、有序列表ol）、表格标签（table）以及表单标签（form），并通过实例展示了这些元素的具体用法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>演示列表标签</title>
</head>
<body>
<!-- List-->
<!--ul表示无序的列表-->
   <ul>
       <!--li标签表示行-->
       <li>我是第一行的内容</li>
       <li>我是第二行的内容</li>
       <li>我是第三行的内容</li>
       <li>我是第四行的内容</li>
   </ul>
<!--ol是有序的列表-->
   <ol>
       <li>有序</li>
       <li>是真的可怕</li>
       <li>石乐志</li>
   </ol>

<!--Table-->
<!--表-->
<!--行-->
<!--单元格-->
<table style="border: 2px solid #f88;" summary="我是表的摘要">

    <caption>我是这个表的标题</caption>

    <!--tr表示一行-->
    <tr>
        <!--th表示表头-->
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
    </tr>

    <!--tr表示一行,这就是第二行了-->
    <tr>
        <!--第二行也就是表示数据了-->
        <!--使用td标签,表示每一个单元格-->
        <td>孙悟空</td>
        <td>700</td>
        <td>女</td>
    </tr>
    <!--tr表示一行,这就是第三行了-->
    <tr>
        <!--第二行也就是表示数据了-->
        <!--使用td标签,表示每一个单元格-->
        <td>唐僧</td>
        <td>1000</td>
        <td>男</td>
    </tr> <!--tr表示一行,这就是第四行了-->
    <tr>
        <!--第二行也就是表示数据了-->
        <!--使用td标签,表示每一个单元格-->
        <td>八戒</td>
        <td>111</td>
        <td>男</td>
    </tr>
</table>

<!--超链接-->
 <a href="1_HTMLBase.html">去1</a>
<br/>
    <a href="https://www.baidu.com" title="你要去百度找什么呀" target="_blank">去百度</a>


<!--form就是表单-->
<!--form的属性-->
<!--method:get/post,是网络请求的两种方式-->
<form method="post" action="1_HTMLBase.html">
    <!--子标签-->
    <!--lable标签就是用来给用户一个提示-->
    <label for="name">姓名:</label>
    <!--type属性表示,input这个标签要以什么形式展示给用户-->
    <!--id属性标识一个标签 就像身份证标识一个人一样 通过id属性的值,就可以找到对应的标签 id属性再同一文件中不可重复-->
    <input id="name"  type="text">
    <br/>

    <label for="password">密码:</label>
    <input id="password" type="password">
    <br/>
    <input type="submit" value="提交">

    <input type="reset" value="重置">
<br />
    <!--大段的文本.可以使用textarea标签-->
    <!--属性:-->
    <!--rows: 几行-->
    <!--cols: 几列-->
    <textarea rows="4" cols="10">
        我们都有一个家名字叫中国兄弟姐妹都很多景色也不错激励第三季度了时间的浪费媕娿我尽快发货娃
        儿竟然女可安排维护费内存
        中国啊中国
        我要伴随他
    </textarea>
</form>
</body>
</html>