`

HTML高级教程 亲和力的表单

 
阅读更多

表单对于残障人士来说是最不容易使用的东西。导航和成文的内容是一种情况,而表单域和信息输入的跳跃又是另一回事儿。因此,为表单增加更多元素,使得表单更易用和更具亲和力未尝不是一个是好注意。

标记

每一个表单域都应该有一个自己的标记。label标签挑选出来,跟for属性一起与一个表单元素关联。

Example Source Code [www.52css.com]
<form>
<label for="yourName">Your Name</label>
<input type="text" name="yourName" id="yourName" /> ...

 
标记为可视化浏览器处理本身使得标记自己可点击增加好处,使相关表单域获得焦点。
注意:name和id两者都是必须的──name为表单处理该表单域,id为标记关联到表单。

分组与图例说明

你可以为表单域分组,比如名字(姓,名,头衔等)或者地址(第一行,第二行,县,地区,邮编,国家等)。使用fieldset标签。
在表单域的分组内,你可以使用legend标签产生图例说明。
注意:可视化浏览器倾向于用围绕在表单组周围的边框来显示,而图例说明打破左上方的边框而显示。


选项分组

optgroup标签用于在一个层叠式选择菜单为选项分类,label属性是必须的,在可视化浏览器中,它的值将会是一个不可选的伪标题,为下拉列表分组。

Example Source Code [www.52css.com]
<select name="country">
<optgroup label="Africa">
<option value="gam">Gambia</option>
<option value="mad">Madagascar</option>
<option value="nam">Namibia</option>
</optgroup>
<optgroup label="Europe">
<option value="fra">France</option>
<option value="rus">Russia</option>
<option value="uk">UK</option>
</optgroup>
<optgroup label="North America">
<option value="can">Canada</option>
<option value="mex">Mexico</option>
<option value="usa">USA</option>
</optgroup>
</select> 


导航域

像连接,表单域(和表单分组)需要为没有指点设备(比如鼠标)的用户导航。与连接相同的方法也可以用在表单元素上,使得任务更容易──tab逗留和快捷键。
可以为input和legend等独立表单标签设置accesskey和tabindex属性。

Example Source Code [www.52css.com]
<input type="text" name="firstName" accesskey="f" tabindex="1" /> 

 

分享到:
评论

相关推荐

    暗色木纹背景html网站模板是一款适合设计公司网站模板下载 .rar

    2. 木纹元素:木纹图案作为一种自然纹理,可以增加网站的亲和力和温馨感,体现设计公司的独特审美和创新思维。 二、HTML结构 1. 响应式布局:这款模板采用响应式设计,能适应不同设备的屏幕尺寸,确保在手机、平板...

    wp木纹背景的精致主题

    3. **木纹背景**: 木纹背景是一种常见的设计元素,它可以为网站增添原始、质朴的质感,使网页看起来更加温馨和有亲和力。在网页设计中,背景选择对于营造氛围和引导用户视线有着重要作用。 4. **模板文件**: 模板...

    健康营养水果产品网页模板

    9. **字体选择**:选用易读且具有亲和力的字体,既满足信息传达的需求,又符合健康主题的调性。 10. **图标和图形**:可能会使用矢量图标,如水果图标、营养图表等,既美观又不失清晰度,同时传达相关信息。 11. *...

    实训商业源码-深蓝健身房瑜伽馆行业小程序V4.5.0全开源解密版-毕业设计.zip

    实训商业源码-深蓝健身房瑜伽馆行业小程序V4.5.0全开源解密版-毕业设计.zip

    毕业论文-Z-BlogPHP海盗导航主题模板-整站商业源码.zip

    毕业论文-Z-BlogPHP海盗导航主题模板-整站商业源码.zip

    基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明

    基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明,该项目是个人毕设项目,答辩评审分达到98分,代码都经过调试测试,确保可以运行!欢迎下载使用,可用于小白学习、进阶。该资源主要针对计算机、通信、人工智能、自动化等相关专业的学生、老师或从业者下载使用,亦可作为期末课程设计、课程大作业、毕业设计等。项目整体具有较高的学习借鉴价值!基础能力强的可以在此基础上修改调整,以实现不同的功能。 基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指挥8种手势识别源码+数据集+模型+详细项目说明基于pytorch实现中国交通警察指

    实训商业源码-在线考试系统源码 学生教师用-毕业设计.zip

    实训商业源码-在线考试系统源码 学生教师用-毕业设计.zip

    实训商业源码-自采集壁纸源码小韩美化版-毕业设计.zip

    实训商业源码-自采集壁纸源码小韩美化版-毕业设计.zip

    ANSYS nCode DeaignLife 高级疲劳分析技术.pdf

    ANSYS nCode DeaignLife 高级疲劳分析技术.pdf

    毕业论文-活动报名 4.1.1+年卡 1.1.3-整站商业源码.zip

    毕业论文-活动报名 4.1.1+年卡 1.1.3-整站商业源码.zip

    BIM和PLM技术在市政工程三维设计中的应用.pdf

    BIM和PLM技术在市政工程三维设计中的应用.pdf

    【Python网络爬虫】反爬虫绕过技术汇总:请求头伪装、动态页面处理与验证码破解策略

    内容概要:本文档详细介绍了Python反爬虫技术的各种应对策略,包括基础和高级方法。基础部分涵盖User-Agent伪装、IP代理池、请求频率控制等,其中涉及使用fake_useragent库随机生成User-Agent、设置HTTP/HTTPS代理、通过随机延时模拟正常访问行为。动态页面处理方面,讲解了Selenium和Pyppeteer两种自动化工具的使用,可以用于加载并获取JavaScript渲染后的网页内容。对于验证码问题,提供了OCR识别简单验证码、Selenium模拟滑块验证码操作以及利用第三方平台破解复杂验证码的方法。登录态维持章节介绍了如何通过Session对象保持登录状态,并且演示了Cookie的保存与读取。数据加密对抗部分探讨了JavaScript逆向工程和WebAssembly破解技巧,如使用PyExecJS执行解密脚本。最后,高级反爬绕过策略中提到了WebSocket数据抓取和字体反爬解析,确保能够从各种复杂的网络环境中获取所需数据。 适合人群:有一定Python编程经验,从事数据采集工作的开发人员。 使用场景及目标:①帮助开发者理解并掌握多种反爬虫绕过技术;②为实际项目中的数据抓取任务提供有效的解决方案;③提高爬虫程序的成功率和稳定性。 其他说明:在学习过程中,建议结合具体案例进行实践,同时注意遵守网站的robots协议及相关法律法规,合法合规地进行数据采集活动。

    毕业论文-叮咚-外卖餐饮小程序6.1.5 前端+后端-整站商业源码.zip

    毕业论文-叮咚-外卖餐饮小程序6.1.5 前端+后端-整站商业源码.zip

    实训商业源码-抢购秒杀系统V1.0.2 安装更新包-毕业设计.zip

    实训商业源码-抢购秒杀系统V1.0.2 安装更新包-毕业设计.zip

    实训商业源码-智答-更好用的语音问答6.0.4-毕业设计.zip

    实训商业源码-智答-更好用的语音问答6.0.4-毕业设计.zip

    毕业论文-发卡-整站商业源码.zip

    毕业论文-发卡-整站商业源码.zip

    Ayla NetWorks:全面探索物联网数据安全和数据隐私.pdf

    Ayla NetWorks:全面探索物联网数据安全和数据隐私.pdf

    毕业论文-活动报名小程序-整站商业源码.zip

    毕业论文-活动报名小程序-整站商业源码.zip

    jquery-1.11.0.min.js(jQuery下载)

    jquery-1.11.0.min.js(jQuery下载)

Global site tag (gtag.js) - Google Analytics