神刀安全网

html+css学习笔记011-表单

Author:Mr.柳上原

  • 付出不亚于任何的努力
  • 愿我们所有的努力,都不会被生活辜负
  • 不忘初心,方得始终

责任与担当

这几天公司招聘文案

好几个应聘上的孩子

答应的好好的第二天来上班

然而却一去不复返

给公司的工作计划造成了极大的困扰

并不是责备他们

而是从他们身上

看到了以前那任性和不负责任的自己

原来当初我那些自以为小小的无所谓的举动

会给亲人、朋友和同事带来那么大的麻烦

只是他们选择了宽容

<!DOCTYPE html> <!-- 文档类型:标准html文档 -->  <html lang='en'> <!-- html根标签 翻译文字:英文 -->  <head> <!-- 网页头部 -->  <meat charset='UTF-8'/> <!-- 网页字符编码 -->  <meat name='Keywords' content='关键词1,关键词2'/>  <meat name='Description' content='网站说明'/>  <meat name='Author' content='作者'/>  <title>前端59期学员作业</title> <!-- 网页标题 -->  <link rel='stylesheet' type='text/css' href='css/css1.css'/> <!-- 外链样式表 -->  <style type='text/css'> /*内部样式表*/  form表单属性 action:' '; 定义数据提交地址 target:' '; 页面打开方式 _block 新窗口打开 _self 原窗口打开 method:' '; 数据提交的方式 get 提交表单的方式(明) post 提交表单的方式(暗)  form表单控件 <input /> type:' '; 控件类型 text; 文本框 password; 密码框 radio; 单选框,需要指定相同的name名称 checkbox; 多选框 button; 按钮,没有特别的功能,多用来结合js提交数据 image; 图片按钮,提交数据 submit; 提交按钮 reset; 重置按钮 file; 文件上传 hidden; 隐藏表单,悄悄提交数据 name:' '; 控件名称 value:' '; 神奇用法...摸索 placeholder:' '; 输入框默认提示文字 checked:'checked'; 默认选中 disabled:'disabled'; 不可选中  <select> </select> 下拉标签 size:' '; 定义默认显示几条内容 样式属性: width:' '; 定义宽度 height:' '; 定义高度,ie兼容有问题  <option></option> 子标签 selected:'selected'; 定义默认显示哪项内容  <textarea></textarea> 文本标签 cols:' '; 定义列数,控制宽度 rows:' '; 定义行数,控制高度 样式属性: width:' '; 定义宽度 height:' '; 定义高度 resize:vertical; 垂直方向可以拖动 resize:horizontal; 水平方向可以拖动 resize:none; 不允许拖动  <fieldset></fieldset> 分组标签 <legend></legend> 组标题  input:focus{ } 焦点 /* 适用于form控件 a标签 button(<button type='button'>按钮</button>) */ outline:1px solid #CCCCCC; 定义焦点边框 </style>  </head>  <body> <!-- 网页主干:可视化区域 -->  <div id='wrap' class='wrap'> <form action='https://www.' target='_block' method=' '> <!-- 表单 --> <!-- input标签用法 --> 用户名:<input type='text' name='user' value='请输入用户名'/> 密码名:<input type='passwrod' name='pw' value='mima'/> 单选: <label> <input type='radio' name='sex' value='nv' checked='checked'/>女 </label> <!-- 关联表单:直接包裹 --> <input type='radio' name='sex' value='nan'/>男 多选: <fieldset> <!-- 表单分组标签 --> <legend>多选:</legend> <!-- 分组标题 --> <input type='checkbox' name='sex1' value='nan' checked='checked'/>男 <input type='checkbox' name='sex2' value='renyao' disabled='disabled'/>人妖 <input id='sex3' type='checkbox' name='sex3' value='nv' checked='checked'/> <label for='sex3'>女</label> <!-- 关联表单:id绑定 --> </fieldset> 按钮:<input type='button' value='按钮'/> 图片按钮:<input type='image' src='images'/> 提交按钮:<input type='submit' value='提交表单'/> 重置按钮:<input type='reset' value='重置表单'/> 上传文件:<input type='file' value='上传文件'/> 隐藏表单:<input type='hidden' value='偷偷地'/>  <!-- select标签用法 --> <select name='select' size:'1'> <option value='nv' selected:'selected'>女</option> <option value='nan'>男</option> <option value='renyao'>人妖</option> </select>  <!-- textarea标签用法 --> <textarea name='textarea' cols='9' rows='9'> </textarea> <div> <!-- maxwidth;maxheight 控制textarea拉伸宽高 --> <textarea name='textarea' cols='9' rows='9'> </textarea> </div> </form> <ul> <li></li> <li></li> <li></li> </ul> </div>  </body>  </html> 

转载本站任何文章请注明:转载至神刀安全网,谢谢神刀安全网 » html+css学习笔记011-表单

分享到:更多 ()