html之select标签

简介:

1、下拉式单选

1
2
3
4
5
< select >
      < option  value = "=1" >上海</ option >
      < option  value = "=2"  selected = "selected" >北京</ option >
      < option  value = "=3" >广州</ option >
</ select >

wKiom1h4dhvwrxxlAADlfNFnNaI233.png


2、显示所有选项

       这里有两种,一直只能单选,一种可多选

1
2
3
4
5
6
7
8
9
10
11
  < select  size = "3" >
        < option >上海</ option >
        < option >广州</ option >
        < option >深圳</ option >
  </ select >
  
  < select  multiple = "multiple"  size = "3" >
        < option >上海</ option >
        < option >广州</ option >
        < option >深圳</ option >
  </ select >

wKiom1h4dvHDusZ7AAAdOSvcr-4666.png


3、元素分类

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
< select >
       < optgroup  label = "河北省" >
           < option >石家庄</ option >
           < option >邯郸</ option >
           < option >枣阳</ option >
       </ optgroup >
       < optgroup  label = "湖北省" >
           < option >武汉</ option >
           < option >咸宁</ option >
           < option >赤壁</ option >
       </ optgroup >
       < optgroup  label = "河南省" >
           < option >郑州</ option >
           < option >安阳</ option >
           < option >驻马店</ option >
       </ optgroup >
</ select >

wKioL1h4d9rBT_t3AAKwtie0Hm4138.png










本文转自 曾哥最爱 51CTO博客,原文链接:http://blog.51cto.com/zengestudy/1891759,如需转载请自行联系原作者

目录
相关文章
|
13天前
|
移动开发 IDE 前端开发
HTML基础-标签与元素:构建网页的基石
【6月更文挑战第1天】HTML是网页基础,由标签和元素定义内容结构与样式。本文介绍HTML标签(如`<p>`)和元素(包括开始、结束标签及内容),并列出常见错误:忘记闭合标签、错误嵌套顺序、不恰当使用自封闭标签及混淆标签与属性。建议遵循标准、使用IDE辅助、验证代码和持续实践来避免错误。示例代码展示基本用法:`<html><head><title>...</title></head><body>...</body></html>`。学习HTML标签与元素是前端开发入门关键。
|
1天前
|
Python
Python基础教程(第3版)中文版 第20章 项目1: 自动添加标签(纯文本转HTML格式) (笔记2)
Python基础教程(第3版)中文版 第20章 项目1: 自动添加标签(纯文本转HTML格式) (笔记2)
|
1天前
|
Python
Python基础教程(第3版)中文版 第20章 项目1: 自动添加标签(纯文本转HTML格式) (笔记)
Python基础教程(第3版)中文版 第20章 项目1: 自动添加标签(纯文本转HTML格式) (笔记)
|
8天前
|
Web App开发 移动开发 前端开发
Web网页制作-知识点(3)——HTML5新增标签、CSS简介、CSS的引入方式、选择器、字体属性、背景属性、表格属性、关系选择器 二
Web网页制作-知识点(3)——HTML5新增标签、CSS简介、CSS的引入方式、选择器、字体属性、背景属性、表格属性、关系选择器 二
13 1
|
8天前
|
移动开发 前端开发 HTML5
Web网页制作-知识点(3)——HTML5新增标签、CSS简介、CSS的引入方式、选择器、字体属性、背景属性、表格属性、关系选择器一
Web网页制作-知识点(3)——HTML5新增标签、CSS简介、CSS的引入方式、选择器、字体属性、背景属性、表格属性、关系选择器 一
23 1
|
8天前
|
存储 移动开发 前端开发
Web网页制作-知识点(1)——HTML5介绍、HTML5的DOCTYPE声明、HTML基本骨架、标题标签、段落 换行、水平线图片图片路径、超链接
Web网页制作-知识点(1)——HTML5介绍、HTML5的DOCTYPE声明、HTML基本骨架、标题标签、段落 换行、水平线图片图片路径、超链接
10 0
|
9天前
|
数据采集 移动开发 搜索推荐
HTML基础-HTML5新增语义标签:解锁网页结构新维度
【6月更文挑战第5天】本文介绍了HTML5的语义标签,旨在提升网页结构化和可访问性。核心语义标签包括`&lt;header&gt;`、`&lt;nav&gt;`、`&lt;main&gt;`、`&lt;article&gt;`、`&lt;section&gt;`、`&lt;aside&gt;`、`&lt;footer&gt;`、`&lt;figure&gt;`和`&lt;figcaption&gt;`。常见问题包括滥用标签作布局工具、忽略`&lt;main&gt;`、不恰当嵌套和忽视辅助功能。
|
13天前
|
前端开发 搜索推荐 UED
HTML基础-文本格式化标签:美化网页内容
【6月更文挑战第1天】本文介绍了HTML的文本格式化标签,包括`<b>`、`<strong>`、`<i>`、`<em>`、`<u>`、`<s>`、`<mark>`、`<small>`、`<sub>`和`<sup>`等,强调了语义化使用和避免常见错误的重要性。示例代码展示了这些标签的用法,帮助提升网页内容的可读性和吸引力。
|
16天前
|
前端开发 JavaScript
HTML图像标签的深入解析与应用
HTML图像标签的深入解析与应用
19 1
|
16天前
|
前端开发 SEO
HTML链接标签的深入解析与应用
HTML链接标签的深入解析与应用
16 0