HTML:HyperText Markup Language 超文本标记语言
(HTML还有一些其他语言到W3Cschool去详细看)
HTML是用于展示网页内容的
1,超文本:超链接
2,标记语言:由标记(标签)构成的语言,就像XML。
工作流程: 浏览器根据URL发送请求给服务求;服务器给浏览器响应,并发送HTML代码;然后浏览器解析服务器响应回来的HTML代码,生成界面。
在项目中新建一个html文件,后缀为.html就可以生成一个HTML文件
标签 <!--HTML的注释语法是这样写的-->
<html>
<head> <!--html的头部分,可以在里面设置一些属性-->
<title>hello world</title> <!--标题-->
<meta> http-equiv="Content-Type" content="text/html ; charset-utf-8 "</meta> <!--设置解析的字符编码-->
<meta> http-equiv="Refresh" content="3;url=http://www.baidu.com"</meta> <!--3秒后刷新,跳转到指定的url-->
</head>
<body> <!--在HTML中不支持传统的空格,回车,制表符-->
<h1>静夜思<br/></h1> <!--这个<br/>标签是回车换行的效果,属于自闭合标签,不分开始结束标签。<h1></h1>换行并且字体加粗,h1表示字体大小-->
<p> <!-- <p></p> 是段落标签,加宽行距-->
<font color="red" size="7" face="黑体">窗</font>前明月光, <!--为窗字设置一些属性,格式如此,其他属性看API-->
疑是地上霜。
</p>
<hr> <!--水平线标签,并且可以自动伸缩-->
2<sup>3</sup> <!--3为2的上标,看起来像2的三次方,但是只是个上标-->
2<sub>3</sub> <!--3为2的下标-->
</body>
</html>
超链接:
<a herf="somthing.html",target="_blank">点击</a> 此格式为超链接,herf后面的是链接的目标。target="_blank"在新页面打开
herf属性:协议名+协议内容 如:http://www.baidu.com
herf="mailto:2213413112@qq.com" 打开邮件的软件
herf="thunder://www.sdakjdoiq.com" 打开迅雷下载
锚点功能
<body>
<a name="_abc"></a>
<img src="123907488.png" border="1" width="300" height="300" alt="好的" theme="">
<img src="123907488.png" border="1" width="300" height="300" alt="好的" theme="">
<img src="123907488.png" border="1" width="300" height="300" alt="好的" theme="">
<a href="#_abc">回到顶部</a> #代表在当前页面范围内 #_abc点击去到当前页面的_abc标签位置。
</body>
表格
用<table></table>表示
在table的体内 行用<tr></tr>表示 列用<td></td>表示
表单
<!--
action属性:决定提交的位置
input
type属性:决定输入的类型
name属性:代表键值对的键,HTML里的键是可以重复的,取值的时候会根据键返回一个数组
value属性:代表键值对的值
size:文本输入框的显示长度,不会影响输入的个数
maxlength:显示文本框的输入长度
readonly:只读,不能修改文本框里的内容,不影响提交
disabled:禁用,不能修改文本框的内容,并且不会被提交。
form
action:表单提交的位置
method:表单提交的方式
get:将参数键值对拼装在URL地址之后
post:参数不在URL上
-->
<form action="#"> <!--#代表自己-->
用户名:<input type="text" name="username" size="5"/><br/>
<!--input:代表输入 type:代表文本类型,name代表键,size代表文本框的显示长度,不影响输入个数-->
密码:<input type="password" name="password"/><br/>
性别:男<input type="radio" name="sex" value="male"/>女<input type="radio" name="sex" value="female"/>
<!--radio是单选框,name和value代表键值对,提交的时候URL格式上会按name=sex&value=male的格式-->
爱好:篮球<input type="checkbox" name="habbit" value="basketball"/>
<!--checkbox多选按钮,提交的时候会按键值对的方式存储,虽然键是相同的,取的时候可以返回
数组就可以了和Map不同-->
足球<input type="checkbox" name="habbit" value="football"/>
排球<input type="checkbox" name="habbit" value="vollyball"/>
学历:<select name="edu">
<!--select代表下拉菜单-->
<option value="zk">专科<option/>
<option value="bk">本科<option/>
<option value="ss">硕士<option/>
</select><br/>
个人说明:<textarea rows="10" cos="35" name="description"></textarea><br>
<!--textarea:文本域-->
照片:<input type="file" name="wenjian"><br> <!--type类型为file,可以选择文件,上传的是一个字节流-->
<intput type="submit" value="提交"/> <intput type="reset" value="重置"/>
<!--type类型中写上submit代表提交,reset为重置,清空填写的内容恢复默认状态-->
</form>