HTML基础

HTML：超文本编辑语言，静态

基础标签

<title>标题</title> 文档的标题，定义了浏览器工具栏的标题，当网页添加到收藏夹时，显示在收藏夹中的标题和搜索引擎结果页面的标题

<h1>一级标题标签</h1> <h1>一级标题</h1>是最大的标题，<h6>六级标题</h6>是最小的标题，浏览器会自动地在标题的前后添加空行

meta标签

<meta>标签用于搜索关于页面的元信息,一般搜索引擎根据meta的关键词来进行爬取，用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务，有利于网站的SEO

<mata name="keywords" content="网络安全" />

link标签

标签只存在于head部分，但是可以出现任意次数。通常用于定义而文档与外部资源的关系。

<link href="http://xxx/main.css" type="text/css">

script标签

<script>标签定义客户端脚本，比如 JavaScript

<noscript>

注释标签

注释，注释内容不起作用，不再浏览器显示界面显示 可以用于XSS绕过

p标签

<p>标签通常用于段落，可以和换行标签结合起来
</br>换行标签,自闭和，可写作</br>或者<br/>
</hr>主题分割，大下划线
<sup>上标字</sup>
<sub>下标字</sub>
<del>删除线</del>
<ins>下划线</ins>
<font>字体属性</font>

form表单

form表单规定当提提交表单向何处发送表单数据，method提交的方式有get、post

get方式就是在浏览器上显示处理出来，get上传内容有大小限制

post是不会在浏览器上显示出来的，是编码后的数据安全后的数据更安全(提交账号密码)，一般来说无大小限制

input标签

文本内容

<input type="text"> 表单本身并不可见，文本域的默认宽度是 20 个字符

<form>
First name: <input type="text" name="firstname">
Last name: <input type="text" name="lastname">
</form>

密码字段

<input type="password"> 密码字段字符不会明文显示，而是以星号或圆点替代

单选按钮

<input type="radio"> 选中一个后另一个将无法选中

<form>
<input type="radio" name="sex" value="male">Male
<input type="radio" name="sex" value="female">Female
</form>

多选框

<input type="checkbox"> 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项

复选框

<select name="address">
<option value="北京">北京</option>
<option value="上海">上海</option>

提交

<input type="submit">  当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理

<form name="input" action="XXX.php" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

enctype属性

enctyep属性规定在发送到服务器之前应该如何对表单数据进行编码

application/x-www-form-urlencoded  在发送前编码所有字符（默认）
multipart/form-data 不对字符进行编码， 在使用包含文件上传控件的表单时，必须使用该值
text /plain 将空格转换为'+'号，但不编码特殊字符

文件上传

<form method="post" action="" enctype="application/x-www-form-urlencoded">
    <input type="file" />
    <input type="submit" value="提交"/>
    </form>
<!--http://45.204.14.220:8098 -->

文本域

<textarea>这是一个文本域
</textarea>

边框

<fieldset>来加个边框</fieldset>

a标签

用于控制页面之间的跳转

#当前页面跳转
<a href="http://www.baidu.com" target="_self">百度</a>
#新建页面跳转 <a href="http://www.baidu.com" target="_blank">百度</a>
#返回顶部 <a href="http://127.0.0.1:8848/Text/index.html" target="_top">返回顶部</a>

img标签

<img src="img/login_logo.png"> width="200",height="200" />
<img src="x" onmouseover=alert(1) />

table标签

<table border="1">
<tr><th>序号</th><th>个人情况</th></tr>
<tr><td>1</td><td>普通</td></tr>
</table>
#tr行  #th列

ul标签

<ul>
        <li>Coffee</li>
        <li>Milk
        <ul>
            <li>red tea</li>
            <li>green tea
            <ul>
                <li>China</li>
                <li>Africa</li>
            </ul>
            </li>
        </ul>
        </li>
        <li>juice</li>
</ul>

framset标签

通过frameset标签引用框架集，一般不能在body里使用

<frameset cols="50%,50%" >
<frame src="http://www.bilibili.com" scrolling="no" />
<frame src="http://www.baidu.com" />
</frameset>