深圳集团网站建设,WordPress句子主题,传奇开服网,黄页目录 1.表单标签
form标签
input标签
选择框
复选框:checkbox 按钮框:button
文件选择框
多行编辑框:textarea
2.html语法练习
展示简历信息
填写简历信息 编辑
3.HTML特殊字符 1.表单标签 表单是让用户输入信息的重要途径 表单域:包含表单元素的区域,重点是form…
目录 1.表单标签
form标签
input标签
选择框
复选框:checkbox 按钮框:button
文件选择框
多行编辑框:textarea
2.html语法练习
展示简历信息
填写简历信息 编辑
3.HTML特殊字符 1.表单标签 表单是让用户输入信息的重要途径 表单域:包含表单元素的区域,重点是form 表单控件:输入框,提交按钮,重点是input form标签
使用form进行前后端交互,把页面上用户进行的操作/输入提交到服务器上.等学习了http协议再详述
input标签
input标签有很多种形态,能够表现成各种用户用来输入的组件 input typetext是单行文本框,框里可以进行输入 input typepassword也是单行文本框,但是使用来输入密码的 一些网站的登陆密码可以切换为文本或者不可见的,就是利用这个特点实现的 选择框
实现了选择功能
body!-- input typetext --!-- input typepassword --请选择性别:input typeradio男input typeradio女
/body 我们发现即可以选男,也同时能选女,并不是单选效果.我们添加一个name属性实现单选
name属性相同的单选框,值之间是互斥的
input typeradio name gender男input typeradio name gender女 实现了单选效果
再加上checked属性,默认是女
input typeradio name gender checked checked女 复选框:checkbox
body明天有什么课?input typecheckbox pythoninput typecheckbox java eeinput typecheckbox 编译原理input typecheckbox 数据库原理
/body 也可以使用checked默认选中 按钮框:button
input typebutton value这是一个按钮 点击按钮之后是啥情况具体操作要靠js来实现,alert就是js中提供的函数
input typebutton value这是一个按钮 onclickalert(hello) 提交按钮:submit
外表是和button差不多的,会触发form和服务器的交互 文件选择框
input typefile
点击选择文件就可选择文件上传 下拉菜单:option
selectoption1/optionoption2/optionoption3/optionoption4/optionoption5/option
/select
效果: 多行编辑框:textarea
bodytextarea cols30 rows20123456/textarea
/body 上述这些标签可以称为控件,是构成图形化界面的基本要素 div标签和span标签
这俩是无语义标签,也就是没有特定含义,适用于各种场景 div默认是独占一行的,是块级元素 span默认是不独占一行的,行内元素 表示一个内容还是优先考虑有确切语义的标签
html的相关文档:mdn 2.html语法练习
接下来用html写一个简单的页面
展示简历信息 代码:
!DOCTYPE html
html langen
headmeta charsetUTF-8meta http-equivX-UA-Compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scale1.0title个人简历/title
/head
body!-- 边框大小 --div styleborder: 3px solid black; width: 500px !-- 正文 --h1YoLo的简历/h1h2基本信息/h2img src头像.png height200pxp求职意向:软件开发工程师/pp联系方式:13645671234/pp邮箱:435223443qq.com/ppa hrefhttps://blog.csdn.net/chenchenchencl?typeblog我的博客/a/ph2教育背景/h2olli1998-2004 金伯利私立小学/lili2004-2007 金伯利私立初中/lili2007-2010 金伯利私立高中/lili2010-2014 杜克大学/li/olh2专业技能/h2ulli熟练掌握Java基本语法,熟悉面向对象程序设计思想/lili熟悉常用的数据结构与算法/lili熟悉操作系统中的典型概念,熟练掌握并发编程/lili熟练掌握网络编程,熟悉网络原理/lili熟练掌握SOL,能够进行基础的增删改查,熟悉索引和事务等机制/li/ulh2我的项目/h2ollih3留言墙/h3p开发时间:2018-2021/pdiv功能介绍/divulli支持留言发布/lili支持匿名留言/li/ul/lilih3学习小助手/h3p开发时间:2021-2023/pdiv功能介绍/divulli支持错题记录/lili支持课程回顾/li/ul/li/olh2个人评价/h2div学习成绩优秀/div/div
/body
/html
填写简历信息
!DOCTYPE html
html langen
headmeta charsetUTF-8meta http-equivX-UA-Compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodytable width 500px cellspacing 0theadh3请填写简历信息/h3/theadtbodytrtdlabel forname姓名/label/tdtdinput typetext id name/td/trtrtd性别/tdtdinput typeradio namesex idmale checked checkedlabel formale!-- 默认是男性 --img srcth.jfif alt width20px男/labelinput typeradio namesex idmale label formaleimg srcth (1).jfif alt width20px男/label/td/trtrtd出生日期/tdtdselectoption--请选择年份--/optionoption2001/optionoption2002/optionoption2003/optionoption2004/option/selectselectoption--请选择月份--/optionoption value1/optionoption value2/optionoption value3/optionoption value4/optionoption value5/optionoption value6/optionoption value7/optionoption value8/optionoption value9/optionoption value10/optionoption value11/optionoption value12/option/selectselectoption--请选择出生日期--/optionoption value1/optionoption value2/optionoption value3/optionoption value4/optionoption value5/optionoption value6/optionption value7/optionoption value8/optionoption value9/optionoption value10/optionoption value11/optionoption value12/optionoption value13/optionoption value14/optionoption value15/optionoption value16/optionoption value17/optionoption value18/optionoption value19/optionoption value20/optionoption value21/optionoption value22/optionoption value23/optionoption value24/optionoption value25/optionoption value26/optionoption value27/optionoption value28/optionoption value29/optionoption value30/optionoption value31/option/select/td/trtrtd就读学校/tdtd input typetext/td/trtrtd应聘岗位/tdtdinput typecheckbox idfrontendlabel forfrontend前端开发/labelinput typecheckbox idbackendlabel forbackend后端开发/labelinput typecheckbox idqalabel forqa测试开发/label/td/trtrtd掌握的技能/tdtdtextarea name id cols30 rows10/textarea/td/trtrtd项目经历/tdtdtextarea name id cols30 rows10/textarea/td/trtrtd/tdtdinput typecheckbox idlisencelabel forlisence我已经仔细阅读公司的招聘要求/label/td/trtrtd/tdtda href#查看我的状态/a/td/trtrtd/tdtdh3请招聘者确认/h3ulli以上信息真实有效/lili能尽快到公司实习/lili能接受加班/li/ul/td/tr/tbody/table
/body/html
3.HTML特殊字符
还有一些特殊字符,不能再html文件中直接表示 空格:nbsp 小于号:lt (因为html就是用大量的标签来表示的,如果正常的使用大于号小于号会发生混淆,因此为了更清晰的使用和机器的解释,就规定了写法) 大于号:gt 按位与:amp
