参考视频：http://edu.51cto.com/index.php?do=lession&id=21940
HTML注释：
<!-- 注释内容 -->
HTML常用基本标签：
<html> //HTML页面根标签
<title> //页面标题标签
<head>//页面头部标签
<body>//页面体标签
<h>//标题标签
<p>//段落标签
<ul>//无序列表
<ol>//有序列表
<li>//列表项
<a>//超链接标签
<img>//图片标签
表格标签：
<table> //表格标签
<tr> //行标签
<td>//单元格
跨行与跨列
rowspan//跨行
colspan//跨列
表单：
表单：Form，用户与服务器交互的界面。表单负责收集用户提交的信息，然后交给服务器去处理，给用户一个反馈信息。
表单标签：
<form> //表单根标签
<input> //输入控件type=text|radio|checkbox|password|submit|reset|image|file|button
<select>//下拉列表
<textarea>//文本域
<form name=“regForm”action=“regok.html”method=“post”>
Name:表单的名字
Action:处理表单的程序
Method:提交表单的方式
Get: 以明文形式，通过URL传参方式提交。安全性差，只能传递字符串，信息量小。
Post:以数据包方式提交，URL地址不显示参数，安全性高，可以提交大文件（二进制文件，视频，音频），信息量大。
块级标签和行级标签：
块级标签：会占据一行，会换行。
<div></div>
<p></p>
<h1></h1>
<ul><li></li></ul>
行级标签：在一行，没有换行。
<span></span>
<em></em> //强调标签
<i></i>
<b></b> //粗体标签
<strong></strong>
CSS
css就像网页的化妆品，让你可以随意的把相同的内容转换成不一样的外观，把就是给相似的结构以不同的样式。css+div是当前最流行的前台美工技术，也是web标准推荐的。
css代码格式：
<style type="text/css">
选择器{
属性:值;
}
</style>
CSS选择器
标签选择器：p { font-size:2em; }
类选择器：.info { background:#ff0; }
ID选择器：#info { background:#ff0; }
组合选择器：
p.info { background:#ff0; }
p#info { background:#ff0; }
Div,p { color:#f00; }
li a { font-weight:bold; }
伪类选择器：
a:link //未被点击的链接
a:visited //已被点击的链接
a:active //点击但未释放的链接
a:hover //鼠标悬停时的链接
CSS的三种使用方式：
行内样式表：行间样式表是指将CSS样式编码写在HTML标签中，格式如下：
<h1 style="font-size:12px;color:#000FFF">
我的CSS样式。
</h1>
内部样式表：内部样式表与行内样式表相似都是把CSS代码写在HTML页面中，不同的是前者可以将样式表放在一个固定的位置，一般放置在<head>标签内部，格式如下：
<style type="text/css">
选择器{
属性:值;
}
</style>
外部引入样式表：外部样式表是CSS应用中最好的一中形式，它将CSS样式代码单独放在一个外部文件中，再由网页进行调用。多个网页可以调用一个样式文件表，这样能够实现代码的最大限度的重用及网站文件的最优化配置，格式如下：
<link rel="stylesheet" rev="stylesheet" href="style.css">
<style type="text/css">
@import url("css/style.css");
</style>
三种使用方式优先级：行内>内部>外部
盒子模型：
border:1px solid #000; 可同时设置上右下左的边框的样式宽度及颜色
border-style:solid; 设置上右下左边框的样式
border-width:1px 2px 3px 4px; 设置上右下左边框的宽度
border-color:#000; 设置上右下左边框的颜色
border-top:1px solid #000; 设置上边框的样式宽度及颜色
border-right:1px solid #000; 设置右边框的样式宽度及颜色
border-bottom:1px solid #000; 设置下边框的样式宽度及颜色
border-left:1px solid #000; 设置左边框的样式宽度及颜色
float属性：
float属性的作用就是改变块元素(block element)对象的默认显示方式。block对象设置了float属性之后，它将不再独自占据一行。可以浮动到左侧或右侧。
float属性值：
left: 元素向左浮动。
right:元素向右浮动。
none:默认值。元素不浮动，并会显示在其在文本中出现的位置。
inherit:规定应该从父元素继承 float 属性的值。
css常用的尺寸单位：
Px 像素Pixel；相对长度单位。相对于显示器屏幕分辨率而言的，国内用的较多，目前还是推荐使用px为好。
Pt 点（Point）；绝对长度单位，主要用来打印，字体适合使用pt。
Em 相对长度单位，这里em与html <em>标签的"EM"拼写完全相同，而这里em作为单独文本单位。1em=16px
CSS+div布局：
DIV+CSS是WEB设计标准，它是一种网页的布局方法。与传统中通过表格（table）布局定位的方式不同，它可以实现网页页面内容与表现相分离。
css+div的好处：
1、网页代码简洁
2、布局容易、改版方便、样式定义灵活
3、轻松的调你想要的网页风格
4、代码易读，区块分明，强化代码重用
background属性：
格式：background:url(地址) repeat-type;
repeat-type可选值：
repeat: 背景在x和y方向都重复
no-repeat:背景不重复
repeat-x:背景在水平方向重复
repeat-y:背景在垂直方向重复
background属性：
background （缩写形式）
background-color（背景色 ）
background-image（背景图 ）
background-repeat（背景图重复方式 ）
background-position（位置坐标、偏移量）
position属性：
absolute: 是相对于自己最近的（必须配置了position为非static值的）父元素来定位的，如果没有符合条件的父元素，则以浏览器窗口为参考。
relative: 是相对于自己来定位的。
static: 默认值。也就是说对于任意一个元素，如果没有定义它的position属性，那么它的position:static。
relative 不脱离文档流，absolute 脱离文档流。也就是说：relative 的元素尽管表面上看到它偏离了原来的位置，但它实际上在文档流中还是没变。
absolute的元素不仅位置改变了，同时也脱离了文档流。
z-index属性：
z-index用来控制标签的层级关系的，最底层的数值最小，最顶层的数值最大页面就好比一叠纸的铺开，你看到最上面的就是层级最大的，最低下的就是层级最小的。
z-index实例
<style>
.z1,.z2,.z3{position:absolute;width:200px;height:100px;pa
dding:5px 10px;color:#fff;text-align:right;}
.z1{z-index:1;background:#000;}
.z2{z-index:2;top:30px;left:30px;background:#C00;}
.z3{z-index:3;top:60px;left:60px;background:#999;}
</style>
HTML5支持：
1、doctype声明改变：<!DOCTYPE html>
2、脚本和链接无需type；
<link rel="stylesheet" href="path/to/stylesheet.css" />
HTML4.0写法：
<link type="text/css" rel="stylesheet" href="path/to/stylesheet.css" />
3、form表单的必要属性；
<input type="text" name="someInput" required>
4、Audio支持
<audio autoplay="autoplay" controls="controls">
<source src="mylove.mp3"/>
</audio>
*.wav
*.mid
5、Vedio支持
<video controls preload>
<source src="test.mp4" type="video/mp4;
' codecs='avc1.42E01E, mp4a.40.2'"
/>
</video>
//preload="preload"或者preload可以使视频预加载
6、正则表达式
账号：<input type="text" name="account" pattern="[A-Za-z]{4,10}" autofocus required/><br>
//账号只能由字母组成，长度4-10位。
589
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
