前端基础、HTML表格列表表单标签、表单控件、使用场景及代码

已于 2024-05-09 21:51:51 修改
阅读量681 收藏 15
点赞数 22
分类专栏： 前端 文章标签： vscode ide 编辑器
于 2024-04-29 22:26:37 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/atatsuki/article/details/138304978
版权

目录

一、表格标签

1.主要作用

2.基本语法

3.表头单元格

4.表格属性

 5.表格结构标签

 6.合并单元格

二、列表标签

1.无序列表（重点）

​编辑

2.有序列表（理解）

3.自定义列表 （重点）

三、表单标

1. 目的

2. 组成

3.表单域 

4.表单控件（表单元素） 

4.1 input输入元素

4.1.1 type属性

  4.1.1文本框和密码框 text和password

​编辑

4.1.2单选按钮和复选框 radio和checkbox

 4.1.3 name和maxlength​编辑

4.1.4 submit和reset

4.1.5 button和file

4.2 label

（2）select下拉表单元素

（3）textarea文本域元素

四、综合案例

五、查阅文档

一、表格标签

1.主要作用

显示和展示数据，不是用来页面布局的！

2.基本语法

<table>
   <tr>
    ...
        <td>单元格文字</td>
    ....
   </tr>
</table>

<table >定义表格

<tr>定义表格中的行，有几行，写几组

<td>定义行中的单元格，一行有几个，写几组

td指表格数据，即table data

3.表头单元格

位于第一行或第一列，表头单元格里的文本内容加粗居中显示

<table>

     <tr>
        <th>姓名</th>

       ....

     </tr>
  ....
</table>

th即table head

4.表格属性

实际开发不常用，后面通过CSS来设置

表格使用案例：

<table>
        <tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
        </tr>
        <tr>
            <td>小周</td>
            <td>24</td>
            <td>女</td>
        </tr>
        <tr>
            <td>小张</td>
            <td>24</td>
            <td>女</td>
        </tr>
        <tr>
            <td>小智</td>
            <td>23</td>
            <td>女</td>
        </tr>
    </table>

 

加表格属性后：

<table align="center" border="1" cellpadding="20">

【注意】要分清cellpadding和cellspacing的区别

案例今日小说榜单：

代码如下：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>今日小说榜单</title>
</head>

<body>

    <table align="center" border="1" cellpadding="10" cellspacing="0" wideth="5000" height="300">

        <tr>
            <th>排名</th>
            <th>关键词</th>
            <th>趋势</th>
            <th>进入搜索</th>
            <th>最近七日</th>
            <th>相关链接</th>
        </tr>
        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#"> 贴吧 </a><a href="#"> 图片 </a><a href="#"> 百科 </a></td>
            <!-- 三个链接需要去往不同的地方，所以需要三组<a></a> -->
        </tr>
        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#"> 贴吧</a><a href="#"> 图片</a><a href="#"> 百科</a></td>
        </tr>
        <tr>
            <td>3</td>
            <td>西游记</td>
            <td><img src="up.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#"> 贴吧</a><a href="#"> 图片</a><a href="#"> 百科</a></td>
        </tr>

        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#">贴吧 </a><a href="#">图片 </a><a href="#">百科 </a></td>
        </tr>

        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#"> 贴吧</a><a href="#"> 图片</a><a href="#"> 百科</a></td>
        </tr>

        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#">贴吧 </a><a href="#">图片 </a><a href="#">百科 </a></td>
        </tr>
    </table>




</body>

</html>

结果如下： 

 5.表格结构标签

将表格分为表格头部和表格主题

<thead></thead>包含<tr></tr>

<tbody></tbody>

代码如下： 

<table align="center" border="1" cellpadding="10" cellspacing="0" wideth="5000" height="300">
        <thead>
        <tr>
            <th>排名</th>
            <th>关键词</th>
            <th>趋势</th>
            <th>进入搜索</th>
            <th>最近七日</th>
            <th>相关链接</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#"> 贴吧 </a><a href="#"> 图片 </a><a href="#"> 百科 </a></td>
            <!-- 三个链接需要去往不同的地方，所以需要三组<a></a> -->
        </tr>
        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#"> 贴吧</a><a href="#"> 图片</a><a href="#"> 百科</a></td>
        </tr>
        <tr>
            <td>3</td>
            <td>西游记</td>
            <td><img src="up.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#"> 贴吧</a><a href="#"> 图片</a><a href="#"> 百科</a></td>
        </tr>

        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#">贴吧 </a><a href="#">图片 </a><a href="#">百科 </a></td>
        </tr>

        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#"> 贴吧</a><a href="#"> 图片</a><a href="#"> 百科</a></td>
        </tr>

        <tr>
            <td>1</td>
            <td>鬼吹灯</td>
            <td><img src="down.jpg"></td>
            <td>456</td>
            <td>123</td>
            <td><a href="#">贴吧 </a><a href="#">图片 </a><a href="#">百科 </a></td>
        </tr>
        </tbody>
    </table>

 6.合并单元格

（1）合并方式：跨行合并和跨列合并

跨行：rowspan="合并单元格的个数"

跨列：colspan="合并单元格的个数"

（2）目标单元格（写合并代码）

跨行：最上侧单元格为目标单元格，写合并代码

跨列：最左侧单元格为目标单元格，写合并代码

 （3）合并单元格三部曲

1.先确定跨行还是跨列

2.找到目标单元格，写上合并方式=合并单元格数量，比如：<td colspan='"2"></td>

3.删除多余单元格

案例：（把第一行第2、3个单元格合并）

如果不把第三个单元格删掉会出现下述情况

案例：（）把第一列第2、3个单元格合并）

是跨行，rowspaon,在第二行第1个单元格写代码,然后把第三行的第1个单元格删掉

 

代码如下

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>今日小说榜单</title>
</head>

<body>

    <table align="center" border="1" cellpadding="50" cellspacing="0" wideth="500" height="249">

        <tbody>
            <tr>
                <!-- 把第一行第2、3个单元格合并，是跨列，colspaon,
                    在第2个单元格写代码,然后把第三个单元格删掉 -->
                <td></td>
                <td colspan="2"></td>


            </tr>
            <tr>
                <!-- 把第一列第2、3个单元格合并，是跨行，rowspaon,
                    在第二行第1个单元格写代码,然后把第三行的第1个单元格删掉 -->
                <td rowspan="2"></td>
                <td></td>
                <td></td>


            </tr>
            <tr>

                <td></td>
                <td></td>

            </tr>

            <tr>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </tbody>
    </table>




</body>

</html>

二、列表标签

使用场景：

表格是用来显示数据的，而列表是用来布局的

分为：无序列表、有序列表、自定义列表

使用场景：

1.无序列表（重点）

<ul>用来表示无序列表，一般以项目符号呈现列表项，而列表项使用<li>来定义

<ul>
    <li>列表项1</li>
    <li>列表项2</li>
    <li>列表项3</li>
    ...

</ul>

【注意】

1.<ul>中不可加<p>,只能放<li>,但，<li>中可以放任何，比如<p>

2.无序列表的各个列表项之间没有顺序级别之分，是并列的

3.无序列表会带有自的样式属性，比如前面的小点，但在实际使用时，会使用CSS来设置

2.有序列表（理解）

<ol>
    <li>列表项1</li>
    <li>列表项2</li>
    <li>列表项3</li>
    ...

</ol>

【注意】

1.<ol>中不可加<p>,只能放<li>,但，<li>中可以放任何，比如<p>

2.有序列表的各个列表项之间有顺序级别之分

3.有序列表会带有自的样式属性，比如前面的123，但在实际使用时，会使用CSS来设置

3.自定义列表 （重点）

<dl>用于描述自定义列表，与<dt>(定义项目/名字)和<dd>(描述每一个项目/名字)一起使用

<dl>
    <dt>名词1</dt>
    <dd>名词1解释1</dd>
    <dd>名词1解释2</dd>
    ...

</dl>

 一个<dt>常用多个<dd>来描述，<dd>之间是并列的

 常用来布局以下情况的页面：

三、表单标

使用场景：

 

1. 目的

收集用户信息

2. 组成

表单域、表单控件(表单元素)、提示信息

3.表单域 

是一个包含表单元素的区域

<form>标签用于定义表单域，以实现用户信息的收集和传递

<form>会把它范围内的表单元素信息提交给服务器

<form action='url地址'method='提交方式'name='表单域名称'>
各种表单元素控件
</form>

4.表单控件（表单元素） 

4.1 input输入元素

<input>收集用户信息

是个单标签，且应该包括一个type

<input type="属性" />
4.1.1 type属性

除type属性外，<input>标签还有其他很多属性：

1.name和value是每个元素都有的属性值，主要给后台人员使用

2.name表单元素的名字，要求单选按钮和复选框要有相同的name值 

3.checked，主要针对单选按钮和复选框，当页面打开的时候就可以默认这个选中这个按钮 

4.maxlength是表单元素输入最大字符数，一般较少用 

  4.1.1文本框和密码框 text和password

type = “text”

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>input表单元素</title>
</head>

<body>

    <form>
        <!-- text 文本框 用户看得见输入的文字 也可以输入任何文字 -->
        用户名：<input type="text"> <br>
        <!-- password 密码框 用户看不见输入的密码 -->
        密码：<input type="password"> <br>
    </form>


</body>

</html>
4.1.2单选按钮和复选框 radio和checkbox

（1）性别，多选一

代码如下

性别:男<input type="radio" > 女<input type="radio" > <br>

（2） 爱好，多选多，用type=“checkbox

代码如下

爱好：吃饭<input type="checkbox">睡觉<input type="checkbox">打豆豆<input type="checkbox">

 

（3）checked=“checked”为默认选项

举例，默认选择，性别女，爱好打豆豆

代码如下
 

性别:男<input type="radio" name="sex" value="男"> 女<input type="radio" name="sex" value="女" checked="checked"> <br>
爱好：吃饭<input type="checkbox" name="hobby" value="吃饭">睡觉<input type="checkbox" name="hobby" alue="睡觉">打豆豆<input
            type="checkbox" name="hobby" alue="打豆豆" checked="checked">

 4.1.3 name和maxlength

这样写，性别男女并不能实现二选一，会出现二选二的情况，可以选择name 来解决这个问题，name是表单元素的名字 这里性别单选按钮必须有相同的名字name才可以实现多选1

代码如下

性别:男<input type="radio" name="sex"> 女<input type="radio" name="sex"> <br>

 maxlength，设置最大长度：

 用户名：<input type="text" name="username" value="请输入用户名" maxlength="6"> <br>
4.1.4 submit和reset

（1）submit

value设置为值

<input type="submit" value="免费注册">

 提交后页面跳转设置举例：（此时并没有设置xxx.php的内容，所以跳转后会显示找不到文件，但我们此处主要是学会这个方法）

method为方法

 <form action="xxx.php" method="get">

 效果：

 

会跳转到：

即：

(2)reset

<input type="reset" value="重新填写"> <br>

 

4.1.5 button和file
 <!-- 普通按钮button 后期结合js搭配使用-->
 <input type="button" value="获取短信验证码"> <br>
 <!-- 文件域，上传文件使用 -->
 上传头像：<input type="file"> <br>

 

4.2 label

把光标放在按钮上就会自动选上，可以增加用户体验

<label for="sex" >男</label>
<input type="radio" name="sex" id="sex"/>

注意for和id的使用

核心：<label>标签的for属性应当与id属性相同 

        <label for="text">用户名：</label><input type="text" id="text"><br>
        <input type="radio" id="nan" name="sex"><label for="nan">男</label>
        <input type="radio" id="nv" name="sex"><label for="nv">女</label>

（2）select下拉表单元素

使用场景如图所示：

 代码如下：

<select>

    <option></option>
    <option></option>
    <option></option>
    <option></option>

....
</select>

 1.<select>至少包含一对<option>

2.在<option>中定义selected="selected“，当前页面即为默认选项 

（3）textarea文本域元素

代码规范：

<textarea rows="5" cols="20">
    文本内容
</textarea>

举例

       <!-- 实际开发不会用，是用css -->
        今日反馈：
        <textarea cols="50" rows="5">
        今天好开心啊
        </textarea>

 

总结代码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>input表单元素</title>
</head>

<body>

    <form action="xxx.php" method="get">
        <!-- text 文本框 用户看得见输入的文字 也可以输入任何文字
        用户名：<input type="text" name="username" value="请输入用户名" maxlength="6"> <br>
        <!-- password 密码框 用户看不见输入的密码 -->
        密码：<input type="password" name="pwd"> <br>
        <!-- radio 单选按钮 可以实现多选一 此时这个选项是可以都选上的，如何让它只能选一个呢-->
        <!-- 用name 是表单元素的名字 这里性别单选按钮必须有相同的名字name才可以实现多选1 -->
        <!-- checked，单选按钮和复选框可以设置，当页面打开的时候就可以默认这个选中这个按钮 -->
        性别:男<input type="radio" name="sex" value="男"> 女<input type="radio" name="sex" value="女" checked="checked"> <br>
        <!-- checkbox 复选框，可实现多选，但也可以单独写-->
        爱好：吃饭<input type="checkbox" name="hobby" value="吃饭">睡觉<input type="checkbox" name="hobby" alue="睡觉">打豆豆<input
            type="checkbox" name="hobby" value="打豆豆" checked="checked"> <br>
        <!-- 点击提交按钮，可以把 表单域 form 里面的表单元素 里面的值 提交给后台服务器 -->
        <input type="submit" value="免费注册"> <br>
        <!-- 充值按钮 恢复原表单默认状态 -->
        <input type="reset" value="重新填写"> <br>
        <!-- 普通按钮button 后期结合js搭配使用-->
        <input type="button" value="获取短信验证码"> <br>
        <!-- 文件域，上传文件使用 -->
        上传头像：<input type="file"> <br> -->

        <!-- <label for="text">用户名：</label><input type="text" id="text"><br>
        <input type="radio" id="nan" name="sex"><label for="nan">男</label>
        <input type="radio" id="nv" name="sex"><label for="nv">女</label> -->

        <!-- 实际开发不会用，是用css -->
        今日反馈：
        <textarea cols="50" rows="5">
        今天好开心啊
        </textarea>
    </form>


</body>

</html>

四、综合案例

 

五、查阅文档

推荐网址：

百度:http://www.baidu.com

W3C:http://www.w3school.com.cn/

MDN:https://developer.mozilla.org/zh-CN/

福星高照~
关注
  • 22
    点赞
  • 踩
  • 15
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
学习软件测试的第三天
W15032092800的博客
02-17 491
一、html的标签 html线上资料：HTML 元素 1.1 表格 表格标签：table table中的行标签 tr table中的列标签 td table标签的属性 width：表格的宽度，值可以是具体的值，也可以是百分比 height：表格的高度，值可以是具体的值，也可以是百分比 border：表格的边框先的粗细 bgcolor：表格的背景色 align：设置表格的对齐方式，center表示居中，left表示居左，right
HTML表格（HTML 表格的使用，收藏这一篇就够了）
热门推荐
weixin_47139649的博客
10-15 6万+
HTML基础之表格 文章目录HTML基础之表格1. 表格的定义2. 表格的标签3. 单元格边框(border)4. 合并单元格4.1 合并行单元格(colspan)4.2 合并列单元格(rowspan)5. 表格格式设置5.1 单元格的对齐（align）（居中，左对齐，右对齐）5.2. 背景色&图片（bgcolor & background）5.2.1 单元格背景色&图片5.2.2 表格背景色&图片5.3 单元格的边距（cellpadding）5.4 单元格间的距离(cel
2024年前端最新前端学习笔记一一HTML表格标签（table），2024年最新字节跳动在哪面试
最新发布
2401_84447362的博客
05-13 799
排序算法根据考频高低主要有：快速排序、归并排序、堆排序、冒泡排序、插入排序、选择排序、希尔排序、桶排序、基数排序、Timsort这十种，这类考核点要么是算法的时间、空间复杂度、稳定度，要么是直接手写代码，故在理解算法原理的同时，对JS语言版的排序算法代码也要加强记忆。在默认情况下，单元格里的内容会紧贴着表格的边框，这样看上去会非常拥挤，可用词语法设置其间距离。表格中行属性的设置与表格的属性设置类似，只需要将相关的属性值添加在行标签中即可，如。
html5表格制作教程,html怎么做表格
weixin_32778881的博客
06-05 7450
html做表格的方法：首先新建一个html，并在“”中间填入表格内容；然后在“”中间输入样式表的样式；最后设置单元格的宽度高度等等样式即可。本文操作环境：Windows7系统、HTML5&&CSS3版，DELL G3电脑html做个表格的步骤如下：1、首先新建一个html，点击中间，先填入表格内容；2、内容根据需求来写即可，示例代码如下：功课表语文7:00-7:407:50-8:3...
怎样用html写表格
zzh_3303097051的博客
11-26 3306
今天上了第二节兴唐杯网页设计的课，今天学的东西不难但一时教这么多东西还是很难以消化的。今天教了怎样在网页上写表格，用到了border,1px是边框宽度，biack是边框颜色，这些都可以在<style> </style>中调。以 <th>序号</th><th>姓名</th><th>电话</th><th>住址</th>这种形式可以输入一行表格内容。块级元素单独成行，有<hn>...
HTML—表格
Ywyyy231128的博客
11-14 4682
此外，thead、tbody和tfoot标签除了可以使代码更具有语义，还有另外一个重要作用 ：方便分块来控制表格的CSS样式。在HTML中，单元格其实有两种：一种是“表头单元格”，使用的是th标签；另一种是“表行单元格”，使用的是td标签。***一个表格只能有一个标题，也就是只能有一个caption标签。***分析：在默认情况下，表格是没有边框的。***说明：th和td在本质上都是单元格，但是并不代表两者可以互换，它们具有以下区别。***说明：在表格中，有多少组“",就表示有多少行。
前端页面控件
06-18
前端页面控件是构建Web应用程序不可或缺的部分，它们允许开发者创建用户友好的交互界面，提高用户体验。这些控件通常包括按钮、输入框、下拉菜单、日期选择器、滑块、图表等多种元素，使得用户能够与网页进行有效...
前端-HTML-Web Excel导入
04-26
`<input type="file">`标签用于创建文件选择控件，用户可以通过这个控件选择本地的Excel文件。 ```html , .xlsx"> 导入 ``` 2. **JavaScript事件监听**： 为了处理文件上传，我们需要监听`<input>`元素的...
Html.rar_表格网页
09-21
HTML表格和表单常常结合使用，比如在数据录入或展示场景，用户可以通过表单输入数据，然后将数据提交到服务器，服务器处理后显示在表格中。同时，JavaScript可以增强表单的交互性，如实时验证用户输入，提供更好的...
表单定位查询
09-24
"表单定位查询"这个主题涉及到网页设计、前端开发以及用户交互等方面的知识，主要关注如何通过输入框实现对表格数据的高效检索和定位。 首先，我们来看“表单”（form）。表单是HTML中的一个重要元素，用于收集用户...
一个基于ASP.NET的HTML在线编辑器控件源代码
09-12
【标题】：基于ASP.NET的HTML在线编辑器控件源代码 HTML在线编辑器是一种用于网页内容创作的工具，它允许用户在浏览器中直接编辑HTML，就像使用Word一样方便。在ASP.NET框架下，我们可以利用C#语言开发这样的编辑器...
用HTML做表格
robotfive的博客
04-13 577
rowspan和colspan的运用
HTML表格
jingan欢迎您来访
07-10 929
&lt;table&gt; &lt;!-- table表示表格 --&gt; &lt;td&gt;                              &lt;!-- td表示行 --&gt;         &lt;tr&gt;...&lt;/tr&gt;                  &lt;!-- tr表示列单元格...
HTML表格基本写法
m0_70977782的博客
02-24 926
姓名 年龄 张三 18岁 王五 12岁
html 简单表格制作（看了它足以应对大部分表格）
yunduan__的博客
11-14 1万+
首先制作一个表格我们要知道一张简单表格是由二部分组成分别是表头，表身。 下面就是一个简单的表格。 每个表格由 table 标签开始。 每个表格行由 tr 标签开始。 每个表格数据由 td 标签开始。如下图 <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> &lt...
HTML 表格 表单的制作
m0_60045654的博客
10-21 6499
表格是一种二维结构，横行纵列。表格由单元格组成。每一行有相同的列数（单元格），每一列有相同的行数（单元格）同一列的单元格，宽度（以最大的为准）相同，同列等宽；同行等高。从服务器角度讲，收集用户的输入数据。从客户端角度来讲，向服务器提交数据的位置。本站搜索<input type="submit" name="button" id="button" value="搜索"></form>
html表格（详解网页表格的制作）
百赢出品，必属精品
04-26 2029
HTML 表格由 标签来定义。HTML 表格是一种用于展示结构化数据的标记语言元素。每个表格均有若干行（由 标签定义），每行被分割为若干单元格（由 标签定义），表格可以包含标题行（）用于定义列的标题。tr：tr 是 table row 的缩写，表示表格的一行。td：td 是 table data 的缩写，表示表格的数据单元格。th：th 是 table header的缩写，表示表格的表头单元格。
HTML第二章 “表格”详解 （附带详细代码与解释）！！！
a2499797637的博客
09-30 8340
1.表格的语法、2. 表格的可选标记、3. 表格的属性、4. 不规则的表格、5. 表格的大小
【web前端基础day02】表格table+表单form
qq_61971608的博客
01-16 3674
HTML over
前端 HTML form表单标签 select标签 option 下拉框
06-13
好的，关于前端HTML表单标签中的select标签和option标签，它们通常用于创建下拉框，以便用户可以从预定义的选项列表中选择一个值。下面是一个简单的例子： ```html <form> <label for="fruit">选择你最喜欢的水果：</label> <select id="fruit" name="fruit"> <option value="apple">苹果</option> <option value="banana">香蕉</option> <option value="orange">橙子</option> <option value="kiwi">奇异果</option> </select> </form> ``` 在上面的例子中，我们使用了select标签来创建一个下拉框，并用option标签定义了可用的选项。每个option标签都有一个值（value）和显示文本（text），当用户选择一个选项时，选项的值将被提交到服务器。希望这个例子能够帮助你理解select和option标签的用法。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值