html 下拉列表 select

最新推荐文章于 2024-06-13 09:00:00 发布

eerieShadow

最新推荐文章于 2024-06-13 09:00:00 发布

阅读量4k

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/qq_42265536/article/details/85220905

版权

前端专栏收录该内容

21 篇文章 0 订阅

订阅专栏

下拉列表：

语法：

<select>

<option >选项显示的内容1</option>

<option >选项显示的内容2</option>

<option >选项显示的内容3</option>

</select>

实例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
</head>
<body>

    <select>
        <option >html</option>
        <option >css</option>
        <option >java</option>
        <option >python</option>
    </select>

</body>
</html>

标签属性：

multiple : 可选属性，只有一个属性值 'multiple' 默认情况下下拉列表只能选择一项，当设置 multiple="multiple" 时，下拉列表可以选择多项

size : 下拉列表展开之后可见列表的数目

实例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
</head>
<body>

    <select multiple="multiple" size="3">
        <option >html</option>
        <option >css</option>
        <option >java</option>
        <option >python</option>
        <option >c++</option>
        <option >c#</option>
        <option >c</option>
    </select>

</body>
</html>

option 标签属性

value : 选项值

selected : 是否选中

value 用来给 javascript 调用或者向服务器传递信息

selected 表示是否被选中，跟 radio 的 checked 是一样的意思

实例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
</head>
<body>

    <p> 选出你最拿手的：</p>
   
    <select multiple="multiple" size="4">
        
        <option >html</option>
        <option >css</option>
        <option >java</option>
        <option selected="selected">python</option>
        <option >c++</option>
        <option >c#</option>
        <option >c</option>
    </select>

</body>
</html>

eerieShadow

关注

0
点赞
踩
13

收藏

觉得还不错? 一键收藏
0
评论
html 下拉列表 select

下拉列表：语法：&lt;select&gt; &lt;option &gt;选项显示的内容1&lt;/option&gt; &lt;option &gt;选项显示的内容2&lt;/option&gt; &lt;option &gt;选项显示的内容3&lt;/option&gt;&lt;/select&gt;实例：&lt
复制链接

扫一扫

专栏目录