元素/属性描述值/备注<select>选项控件?required必填，表单的通用属性，还有disabled、autofocus、form等?multiple多选 ， 显示为列表，不设置该属性则弹出下拉框 。值也是multiple，值可省略?size控件显示的选项行数，配合multiple使用整数 ， 默认1?value/selectedIndex选中的值/索引<option><select>的选项子元素?selected设置选中值可省略?value选项的值如果没有value，则取标签内容?disabled不可用<optgroup>选项分组，给<option>分组?label显示的文本?disabled分组都禁用<form action="">多选multiple：<select id="selfruit" name="selfruit" multiple size="4" list="optfruit"><optgroup label="热带水果"><option value="https://www.huyubaike.com/biancheng/1">香蕉</option><option value="https://www.huyubaike.com/biancheng/2">火龙果</option></optgroup><optgroup label="蔬菜"><option value="https://www.huyubaike.com/biancheng/3">绿色蔬菜</option><option value="https://www.huyubaike.com/biancheng/4">冬瓜</option><option value="https://www.huyubaike.com/biancheng/4" disabled>男瓜</option></optgroup><option value="https://www.huyubaike.com/biancheng/5">其他</option></select>单?。?<select name="selsex" size="0" required><option value="" selected>选择性别</option><option value="https://www.huyubaike.com/biancheng/1">男</option><option value="https://www.huyubaike.com/biancheng/2">女</option><option value="https://www.huyubaike.com/biancheng/5">其他</option></select><input type="submit"></form>
文章插图
07、<progress><meter>进度计量两者都可以实现进度的效果，
<progress>为进度条元素 。<meter>更为丰富，表示某种计量，适用于温度、重量、金额等量化的可视化展示 。属性描述<progress>IE10进度条?max最大值 ， 默认为1?value进度值 ， 不设置则为"不确定"状态，显示为加载中的效果（不同浏览器表现不同）<meter>IE进度计量，显示已知范围的标量值或者分数值 。（/?mi?t?r/ 计量）?value值?min/max最小值（默认0），最大值（默认1）?low/high低值、高值，用于设置“正常值”的边界区域，以显示不同效果?optimum最优值（ /?ɑ?pt?m?m/ ） ， 配合low/high使用 ， 判断当前值是否最优?form关联form表单的id
<fieldset style="display:inline-block;"><legend>Progress</legend>progress：<progress value="https://www.huyubaike.com/biancheng/0.3"></progress><br>progress(无value)： <progress></progress><br>value溢出： <progress max="100" value="https://www.huyubaike.com/biancheng/120"></progress></fieldset><fieldset style="display:inline-block;"><legend>Meter</legend>普通进度：<meter value="https://www.huyubaike.com/biancheng/0.2"></meter><br>value小于low：<meter value="https://www.huyubaike.com/biancheng/10" max="60" min="0" optimum="26" low="20" high="30"></meter><br>value大于high：<meter value="https://www.huyubaike.com/biancheng/55" max="60" min="0" optimum="15" low="20" high="30"></meter><br>value居中<meter value="https://www.huyubaike.com/biancheng/25" max="60" min="0" optimum="26" low="20" high="30"></meter></fieldset>
文章插图
08、表单布局表单是前端常用的组件，布局必不可少，一个美观、简介的布局尤为重要 。一个最小单位的表单输入部件，除了表单元素，还必须考虑标题、错误提示等 。对于整个表单还要考虑多个表单输入项的行列排列、对齐 。
文章插图
最基本的HTML表单布局思路：
- 小部件：用
<div>或<p>包装一个最小的部件，里面包含<label>表单项标题、<input>、<span>提示信息 。
<div><label for="uname">姓名：</label><!-- 标签 --><input type="text" name="uname" required maxlength="20"> <!-- 表单元素 --><span title="必填">*</span><!-- 作为额外提示，包括输入验证错误的提示信息 --></div>- 表单分区，对于复杂的表单，用
<fieldset>、标题<h*>、分段<section>推荐阅读
- 四 Selenium4.0+Python3系列 - 常见元素操作（含鼠标键盘事件）
- 1 HTML元素大全
- 支付宝小鸡今日答题答案大全
- 2 HTML躬行记——WebRTC基础实践
- 1 人人都懂的HTML基础知识-HTML教程
- 彻底学会Selenium元素定位
- 抖音直播礼物最新价目大全
- 跃迁旅人元素塔的进人方法是什么
- 划拳令怎么玩（划拳十句口诀大全)
- 二 Selenium+Python系列 - 元素定位那些事
