html基础 表单相关属性综合实战案例 附有注释
html结构代码:
<form > <!-- form 为了让重置按钮生效-->
<h1>青春不常在,抓紧谈恋爱</h1>
<hr>
昵称: <input type="text" placeholder="请输入昵称"> <br><br> 性别: <input type="radio" name='sex' checked id='man'>
<label for="man">男</label> <!--点击文字选择此项--> <input type="radio" name='sex' id='woman'>
<label for="woman">女</label> <br><br> <!-- 生日: -->
生日: <input type="date" > <br><br>
城市: <select >
<option >北京</option>
<option selected>上海</option>
<option >广州</option>
<option >深圳</option>
</select>
<br><br> <!--br换行--> 婚姻状况: <input type="radio" name="abc" checked id='marry'>
<label for="marry">未婚</label> <input type="radio" name="abc" id='married'>
<label for="married">已婚</label> <input type="radio" name="abc" id='secrecy'>
<label for="secrecy">保密</label>
<br><br> 兴趣爱好: <input type="checkbox" checked id='aw'>
<label for="aw">抽烟</label> <input type="checkbox" checked id='ax'>
<label for="ax">喝酒</label> <input type="checkbox" id='ae'>
<label for="ae">烫头</label>
<br><br> 个人介绍: <br><br>
<textarea cols="30" rows="10"></textarea> <!--textatea 区域文本框-->
<h2>我承诺</h2>
<ul> <!--无序类别的应用-->
<li>年满18岁、单身</li>
<li>抱着严肃的态度</li>
<li>真诚选择另一半</li>
</ul> <br>
<input type="checkbox">我同意所有条款 <br>
<input type="submit" value="免费注册">
<input type="reset" >
</form>
html基础 表单相关属性综合实战案例 附有注释的更多相关文章
- HTML5新标签与特性---新表单+新属性----综合案例1
HTML5新标签与特性 兼容性问题 (ie9 以上的版本) 文档类型设定 document HTML: sublime 输入 html:4s XHTML: sublime 输入 html:xt HTM ...
- bootstrap 基础表单
表单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文本域和按钮等.其中每个控件所起的作用都各不相同,而且不同的浏览器对表单控件渲染的风格都各有不同. ☑ LESS版本:对应源文 ...
- HTML表单__表单元素属性
看完"HTML表单__表单元素"那一节的同学会发现,同是input标签,type属性值不一样的时候,input类型完全不一样.type就是input的一个属性,除type之外,还有 ...
- Bootstrap系列 -- 11. 基础表单
表单主要功能是用来与用户做交流的一个网页控件,良好的表单设计能够让网页与用户更好的沟通.表单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文本域和按钮等.其中每个控件所起的作用都各 ...
- bootstrap 基础表单 内联表单 横向表单
bootstrap 基础表单 内联表单 横向表单 <!DOCTYPE html> <html> <head> <title></title> ...
- HTML5表单新属性
HTML5表单新属性 autofocus 自动聚焦 <input type="text" autofocus> placeholder占位文本 tel ...
- 设置iframe内表单target属性以兼容IE、Firefox【转载】
设置iframe内表单target属性以兼容IE.Firefox[转载] 2011年11月19日 haibor 今天有客户反应,在一产品网站的资源下载页面,用户登录提交后页面无反应! 经测 ...
- JavaScript | 基础表单验证(纯Js)
———————————————————————————————————————————— 基础表单验证(纯js) - - - - - - - - - - - - - - - - - - - - - - ...
- html/form表单常用属性认识
1.form表单常用属性练习 <style> .form1 { margin: auto; height: 900px; width: 500px; text-align: center; ...
随机推荐
- JPA和事务管理
JPA和事务管理 很重要的一点是JPA本身并不提供任何类型的声明式事务管理.如果在依赖注入容器之外使用JPA,事务处理必须由开发人员编程实现. 123456789101112UserTransacti ...
- Salesforce LWC学习(三十七) Promise解决progress-indicator的小问题
本篇参考:https://developer.salesforce.com/docs/component-library/bundle/lightning-progress-indicator/exa ...
- 【简】题解 AWSL090429 【原子】
预处理出每个原子最近的不能合并的位置 枚举当前位置和前面断开的位置合并 发现还是不能过 考虑用选段树优化 但是因为每次转移的最优点是在前面可以合并的范围内 dp值加上当前的到该点的最大值 因为每个位置 ...
- Git remote 远程仓库链接管理
SVN 使用单个集中仓库作为开发人员的通信枢纽,通过在开发人员的工作副本和中央仓库之间传递变更集来进行协作. 这与 Git 的分布式协作模型不同,后者为每个开发人员提供了自己的仓库副本,并具有自己的本 ...
- Python 如何管理类的创建行为
问题 如果我们要给类加上一个属性,只需在定义的时候加上属性就可以了: class Animal: can_fly = True 如果这样的类有很多,我们可以定义一个父类,让其它类继承他就可以了: cl ...
- [BUUCTF]PWN——jarvisoj_level1
jarvisoj_level1 附件 步骤: 例行检查,32位程序,没有开任何保护 本地运行一下程序,看看大概的情况,可以看到输出了一个地址 32位ida载入,习惯性的检索程序里的字符串,没有发现可以 ...
- ASP.NET MVC 导入Excel文件(完整版)
View视图部分: <form method="post" enctype="multipart/form-data" action="/Pos ...
- Tornado WEB服务器框架 Epoll
引言: 回想Django的部署方式 以Django为代表的python web应用部署时采用wsgi协议与服务器对接(被服务器托管),而这类服务器通常都是基于多线程的,也就是说每一个网络请求服务器都会 ...
- 分布式系统一致性算法(Raft)
过去, Paxos一直是分布式协议的标准,但是Paxos难于理解,更难以实现,Google的分布式锁系统Chubby作为Paxos实现曾经遭遇到很多坑. 来自Stanford的新的分布式协议研究称为R ...
- 事件处理 及冒泡 阻止默认事件 以及tab 切换的思路
1.axios post通过点击事件提交数据不需要使用input直接使用state2.pdd你好天天象上默认执行点击(1,2,3)也可以执行并且能切换页码3.tab 针对新闻不同时4.天天象上首页和精 ...