HTML(超文本标志语言)
1.html代码实际上就是一套能够被浏览器所识别的规则代码,由一个个标签组合,html代码就是一大串字符串,而这种字符串的格式正好能够被浏览器所识别,也就是web页面;
2.前端与后端交互方式
1)后端通过直接返回浏览器能够识别的html代码
2)后端返回数据,前端替换html种的指定数据
3.HTML标签(注释:快捷键:ctrl+shift+/,注释一行或者多行:ctrl+/)
<!DOCTYPE html><!--标准的html规则,类似于Python的解释器--> <html lang="en"><!--html标签只能一个,指定语言为en--> <head><!--head标签的开始--> <!--自闭合标签--> <meta charset="UTF-8"><!--编码--> <!--主动闭合标签--> <title>测试</title><!--浏览器tab上的标题--> </head><!--head标签的结束--> <body><!--body标签的开始--> </body><!--body标签的结束--> </html>
4.h、div、span、input、form、label、select、a、textarea
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!--标题标签--> <h1>标题1</h1> <h2>标题2</h2> <h3>标题3</h3> <!--div块级标签,无论自己多大,都占满屏幕,伪白板标签--> <div>div标签</div> <!--span行内标签又叫内联标签,自己多大就占多大,也叫白板标签--> <span>span标签</span> <!--属性:写在标签内部的 <> 之间的标签名之后 属性与属性之间用空格分隔--> <input type="text" placeholder="请输入用户名"> <!--value属性是input的默认值属性--> <input type="text" value="请输入用户名"> <!--密文输入框--> <input type="password"> <!--1.按钮:没有在form中时没有任何区别--> <input type="button" value="登录"> <input type="submit" value="注册"> button没有反应需要主动绑定事件,submit会与后台产生交互 form跟后台交互:1.form表单的方式;2.异步提交 ajax <form method="get"> <!--<input type="button" value="登录" onclick="alert(1111)">--> <!--<input type="submit" value="注册">--> <!--radio单选--> <span>男</span><input type="radio" name="sex"> <span>女</span><input type="radio" name="sex"> <!--checkbook多选,checked默认选中--> <span>篮球</span><input type="checkbox" checked="checked"> <span>足球</span><input type="checkbox"> <!--上传文件--> <input type="file"> <!--文本框--> <input type="text"> <!--重置,必须与form连用才起作用--> <input type="reset"> </form> 点击用户名没有作用 <span>用户名</span><input type="text"> <!--点击用户名,识别点击输入框--> <label for="user">用户名</label><input type="text" id="user"> 选择下拉框,selected默认选中,option被select包裹 <select name="xxxx"> <option value="2">篮球</option> <option value="3" selected="selected">足球</option> <option value="1">兵兵球</option> </select> 在本来的页面进行跳转 <a href="http://www.baidu.com">跳转到百度</a> <!--target新打开一个浏览器tab--> <a href="http://www.baidu.com" target="_blank">跳转到百度</a> <textarea name="122">多行文本</textarea> </body> </html>