HTML的基础知识

1.HTML的基本信息

1.html的注释

<!-- -->

快捷键Ctrl+/

快捷键Ctrl+d 复制到下一行

2.DOCTYPE

告诉浏览器，使用什么规范，浏览器默认的规范是html

3.标签

代表网页头部

4.标签

代表网页的主体

5.

代表网页的标题

6.标签

描述性标签，描述网页基本信息，一般用来做SEO

2.网页的基本标签

快捷键输入 字母+TAB键

1.标题标签

一级标签

二级标签

三级标签

2.段落标签

3.换行标签

4.水平线标签

---

5.粗体标签

6.斜体标签

7.空格&nbsp

大于 &gt

小于 &lt

版权 &copy

3.图形标签

img+Tab
src:图片路径(必填)
相对地址（推荐使用），绝对地址
../ 上一级目录（例../resources/image/1.png）
alt:图片名字（必填）

4.链接标签

a标签
herf:（必填），表示要跳转的窗口
target:表示窗口在哪打开
    _blank   在新标签中打开
    _self    在自己的网页中打开l

锚链接
1.需要一个锚标记   <a name="top">顶部</a>
2.跳转到标记      <a href="#top">回到顶部</a>

功能性链接
邮件链接 <a href="2013527385@qq.com"点击联系我></a>
qq链接  <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=&site=qq&menu=yes">
  <img border="0" src="http://wpa.qq.com/pa?p=2::52" alt="点击这里给我发消息" title="点击这里给我发消息"/></a>
<a href="#top">回到顶部</a>

5.列表标签

有序列表 <ol>   </ol>

无序列表 <ul>   </ul>

自定义标签
<dl>:自定义标签
<dt>:列表名字
<dd>:列表内容

6.表格标签

表格<table> </table> 在table中用 border="10px" 定义表格宽度
行 <tr> </tr>
列 <td> </td>
<td colspan="4"> 跨列
<td rowspan="2"> 跨行

7.视频和音频

controls  显示进度条界面
autoplay  自动播放     

<video src="" controls autoplay></video> 视频
<audio src="" controls autoplay></audio> 音频

8.网页结构

<header>
  <h2>网页头部</h2>
</header>           网页头部
<section>
  <h2>网页主体</h2>
</section>          网页主体
<footer>
  <h2>网页脚步</h2>
</footer>           网页脚步

9.内联框架

内联框架 <iframe> </iframe>
width 宽度
height 高度

10.表单提交post和get

表单form
action :表单提交的位置，可以是网站，也可以是处理地址
method":post,get提交方式
get方式提交:可以在url中看到提交的信息，不安全，高效
post:比较安全，传输大文件

文本输入框：input type="text"
value="高宇鹏"   默认初始值
maxlength="8"   最长能写的字符长度
size="30"       文本框长度
readonly 只读 不能改
checked 默认值
disabled 禁用
hidden 隐藏域

密码输入框：input type="password"

单选框标签  input type="radio"
values:单选框的值
name: 表示组

 多选框  <input type="checkbox">

 按钮
<input type="button"> 普通按钮
<input type="image"> 图相按钮
<input type="submit"> 提交按钮
<input type="reset"> 重置按钮

下拉框，列表框
    <select name="列表名称">
    <option value="china">中国</option>
    <option value="us">美国</option>
    <option value="eth" selected>瑞士</option>
  </select>

文本域
 <textarea name="textarea" cols="20"（长） rows="20"（宽）>请输入</textarea>

文件域
 <input type="file" name="files">

邮件验证 <input type="email" name="email">

url验证 <input type="url" name="url">

数字验证
<input type="number" name="num" max="100" min="0" step(步长)="10">

滑块 <input type="range" name="voice" min="0" max="100" step="10">

搜索框  <input type="search" name="search">

增强鼠标可用性
<label for="mark">你点我试试</label>
<input type="text" id="mark">

表单初级验证
placeholder 提示信息
required 非空验证
pattern 正则表达式