html:超文本标记语言。用于定义文档的内容结构。（Hyper Text Markup Language）。
Hyper Text(超文本)：不只包括文本，还包括图片。连接，音乐，视频等非文本元素。
Markup Language 标记语言 ：是一套标记标签，html是使用标记标签来描述网页的。
html的注释：<!--注释内容-->
译：注释用于描述代码功能，浏览器解析代码会忽略注释内容
快捷键：ctrl+? ??一下注释 ?二下撤销
html元素（标记，标签）：
1.什么是html元素：html元素是html文档的重要组成部分，一个html文档由大量元素组成的html中的所有内容结构。都是靠元素组织到页面中。
例： <h3> </h3>
h3是起始标签（元素，标记）表示元素的开始 ????中间的空格之间是元素内容 ?????/h3是结束标记（标签，标记）表示元素的结束
例： <a herf ="路径"> 百度 </a>
????标记 ?属性名 ???属性值 ?元素内容 ?????结束标记
（a 标记一个连接）
2.html 元素的组成部分
3.空元素:又叫自闭合元素
<img ??str =" " />
4 .元素的层次结构：一个元素的内容可以包含其他元素，形成嵌套的层次结构。但是2个元素之间不能嵌套。
例： <a> <h3></h3> </a> 对
例 ：<p><strong></p><strong> 错
html文档结构：
1. 文档声明既不是元素，也不是注释，它总是出现在html代码的第一行。<! DocTYPE html >：用于通知浏览器，目前的文档正在使用那一个html的版本。若不是文档声明。浏览器渲染页面时会进入怪异模式。
2.html元素：又叫根元素，根标记，它是所有其他元素的祖先元素。文档中所有其他元素都必须放置在元素内容中。
相关属性：lang
该属性可能会影响到浏览器的语音阅读和翻译行为。
例：<html lang= "en"></html> 文档中使用英文来书写
例：<html lang= "zh-Cmn-Hans"></html> 文档中使用中文来书写
3 head 元素：又叫文档头，它是html元素的第一个子元素，文档头中可以包含一些其他元素，用于描述页面的附加信息。
litle 标题：标识文档标题，该标题会显示在浏览器的标题栏上货标签页上。
<meta>空元素，标识页面的其他元数据（页面相关的附加信息），只是一个空元素。
例： <meta charsef="utf-8">指浏览器，使用字符编码集utf-8解析页面。
head 元素中包含以下元素：<title><meta><style><link><script>
4.body元素：又叫文档体，网页中所有的可见内容都放在该元素中。
它包含了大量的其他元素，定义文档的内容结构。
绝对路径和相对路径：
引用css：
1.使用外部样式表：css代码在一个独立的文件中，html通过Link 元素引入到页面。
例：<link rel ="stylesheet" herf = " 导入路径">
link 空元素。表示引用外部资源。
2.使用内部样式表：将css代码写到html文档的style 元素内容中
使用内部样式表的特点：①没有样式表文件，在某些时候可以提升效率；
②多个页面难以共享样式，不利于代码复用。
③html和css代码混杂，不利于程序员和搜索引擎阅读。
3.使用行内样式表：又叫内嵌，css代码写在元素的style中属性，行内样式不写选择器。
使用行内样式表的特点：①没有了样式表文件，在某些时候可以提升效率。
head里面的子元素有：
搜属于元数据和脚本标签
<meta charset= "utf-8">
<title>哈哈</title>
<style type="text/css">
<link rel ="stylesheet" herf= "路径"></style>
<script> </script>
<noscript> </noscript>
<base herf=" "/> 来写出相应的命令
文本元素：
<a herf =" ww.baidu.com"> 百度</a>
</span>你好，世界！</span> 对长段文字当中一段文字进行改变
<b>你好，世界！</b> 不许用 加粗
<strong> 成都，你好！</strong> ?有语意 ??加粗
斜体 <i> </i>
<em> ??</em>有着重效果，有语意，针对视力有问题的
缩写 <abbr title = "Hyper Text Markup Language"> HTML </addr> 显示的是HTML ,当鼠标刚在HTML上 全称Hyper Text Markup Language"就显示出来了。
时间 <time datetime = "2018-2-14">情人节</time >
????????????????????????属性 ?????值
字体 <small> </small>不建议使用 它只缩小一号
sup/sub 上下标签 ，X <sup>2 </sup> 显示的是x 的平方；O<sub> 2 </sub> 显示的是氧气
引用：大段引用：<blockquote> </blockquote> 默认前面 有缩进 它不属于文本元素，是组合内容
定义引用：<cite> </cite> 写相应的代码
<mark> </mark>是一个标签。背景颜色自动为黄色
组合内容：
换行<br> 不能使用-
横线 <p> <hr> </p> 不能用 分割上下
区域 区块之前的html用来进行布局：
<div>
</div>
预编译<pre> </pre>代码中怎么写的怎么显示出来。用到的很少
大段引用：<blockquote> </blockquote> 默认前面 有缩进
src 属性表示引用内部资源
<img src ?= "alt" ="logo"> 当图片无法显示出来"logo"
herf 属性表示访问或获取外部资源 ；<link herf =" ">外部样式
<a herf =" "> 跳转
图片描述
?<figure>
????????<img src ?= ?“ ?” ?alt ="logo">
???????<figcapiton> ??蜡笔小新 </figcapiton>
<figure>
<head>
<meta name ="keyword" content="蜡笔小新，小白，美伢.."/> 关键字/关键词
<meta name ="discription" content="它是一部日本动漫，讲述了..."
</head>
列表：
有序列表
<ol>
???<li> </li>
??<li> </li>
</ol>
快捷键 ol>li*n tab键
无序列表
<ul>
???<li> </li>
??<li> </li>
</ul>
快捷键 ul>li*n tab键
定义列表
<dl>
<dt> ?前端工程师</dt>
<dd> 需要具备</dd>
<dl>
表格元素：
<table border = "2"> 译2px 边框
????????<tr>
?????????????<td></td>
????????????<td></td>
???????????<td></td>
???</tr>
</table>
快捷键： tr*行数>td*列数
td clospan = "几个单元格" column代表列 横向合并为列
td ?rowspan = ?"几个单元格" ???row 代表行 ?????????纵向合并为行
*表单元素 <form action = " #" method=" get/post"
??????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????
输入框：
<input type ="text"/>
<input ?type ="password"/>
<input ?type ="submit" value=" "/> 提交按钮，具有提交功能，浏览器可以识别
<input ?type ="button" value=" "/>普通按钮
<input ?type =" reset"/> ??重置按钮
<input ?type =" number"min=" " max=" " step=" " value=" "/> ????( ?max 最大值step间距/步数 value初始值 min最小值)
<input ?type ="text" required maxlength= " "/> 必填项 ??输入框的长度
<input ?type =" date"/> 添加日理插件
<input ?type =" color" name =" color"/> ??你喜欢的颜色
select 下来菜单（列表）：
ctr+d复制当前这行
<select name = " city" id=" ">
<option value =" cd" >成都 ?</option>
<option value =" my" >绵阳 ?</option>
<option value =" gy" >广元 </option>
......
</select >
单选框：
<input type =" radio" name= " aihao"value="paobu"/>跑步
<input ?type =" radio" ?name= " aihao"value="lvyou"/>旅游
<input ?type =" radio" ?name= " aihao"value="kanshu"/>看书
<input ?type =" radio" ?name= " aihao"value="huahua0"/>画画
多行文本框：
<input type =" checkbox" name= " aihao"value="paobu"/>跑步
<input ?type =" checkbox" ?name= " aihao"value="lvyou"/>旅游
<input ?type =" checkbox" ?name= " aihao"value="kanshu"/>看书
<input type =" checkbox" name= " aihao"value="huahua0"/>画画
提示快捷信息选择：
????????<input type ="text" list =" city"
????????<datalist id = "city">
????????????????<option value ="CD">成都 ???</option>
????????????????<option value ="SN">遂宁 ???</option>
????????????????.........
???????</datalist>
语义化结构元素：
header 用于表示页面或某个区域头部
nav 用于表示导航栏
aside 用于表示周围主题相关胡附加信息
article 用于表示文章或其他可独立页面胡内容
section 用于表示一个整体胡一部分主题
footer 用于表示页面或某个区域胡脚注
嵌入式元素：<img src = " ..." alt ="logo">
音频/视频元素：
<audio src = " 路径" controls autoplay loop></audio> 音频播放
<video src = " 路径" controls ?autoplay ?loop> </video> ?音频播放
controls 为属性，值也是 controls ，所以这里写一个 controls 就可以了
autoplay 自动播放，不用点开始
loop ?????????循环播放
交互元素：
<datails>
????????????????<summary>
????????????????</summary>
????????????????<p>
???????????????</p>
</datails>
总结这周学习的html知识
原文地址：http://www.cnblogs.com/hemei1212/p/8052823.html