HTML简介

HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写，他是一种制作万维网页面标准语言（标记）。相当于定义统一的一套规则，大家都来遵守他，这样就可以让浏览器根据标记语言的规则去解释它。浏览器负责将标签翻译成用户“看得懂”的格式，呈现给用户！(例：django模版引擎)

HTML文档

Doctype

<!DOCTYPEhtml>/*推荐*/Doctype告诉浏览器使用什么样的html或xhtml规范来解析html文档

Meta(metadata information)

提供有关页面的元信息，例：页面编码、刷新、跳转、针对搜索引擎和更新频度的描述和关键词

页面编码（告诉浏览器是什么编码）<metahttp-equiv="content-type"content="text/html;charset=utf-8"><metacharset="UTF-8">

刷新和跳转<metahttp-equiv="Refresh"Content="30"><metahttp-equiv="Refresh"Content="5;Url=http://www.baidu.com"/>/*这句话很厉害的*/

关键词<metaname="keywords"content="星际2,星际老男孩,专访,F91,小色,JOY">

描述例如：cnblogs

X-UA-Compatible兼容IE8以下貌似<metahttp-equiv="X-UA-Compatible"content="IE=EmulateIE7"/><metahttp-equiv="X-UA-Compatible"content="IE=edge"/>Title

网页头部信息<title>it'stitle</title>Link

css<linkrel="stylesheet"type="text/css"href="css/common.css">

icon<linkrel="shortcuticon"href="p_w_picpath/favicon.ico">Style

在页面中写样式

<styletype="text/css">.bb{background-color:red;}</style>Script

引进文件<scripttype="text/javascript"src="http://xxx/js/gpt.js"></script>

写js代码<scripttype="text/javascript">...</script>常用标签

标签一般分为两种：块级标签 和 内联（行内）标签

a、span、select 等

div、h2、p 等

各种符号

http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html

p 和 br

p表示段落，默认段落之间是有间隔的！

br 是换行

a标签

1、target属性，_black表示在新的页面打开<ahref="http://www.baidu.com"target="_blank">newpage</a>

2、锚<ahref="#t31">各种符号</a>/*通过id来查找*/H 标签

<h2></h2>--><h7></h7>select 标签

下拉菜单<select><option>下线</option><option>在线</option></select>radio

单选按钮（name一致，便为一组，只能选择一个选项）<inputtype="radio"name="gender"value="man"><inputtype="radio"name="gender"value="male">password及text

<inputtype="text"><inputtype="password">button

<inputtype="button"value="button"><inputtype="submit"value="submit"><inputtype="reset"value="reset">file

<divid="t310"><h3>file</h3><inputtype="file"value="file"></div>提交文件时要在form表单里加上：enctype='multipart/form-data'method='POST'textarea

<textarea></textarea>label

<labelfor="name2">姓名：<inputid="name2"type="text"></label><labelfor="marriy2">婚否：<inputid="marriy2"type="checkbox"></label>fieldset

<fieldset><legend>登录</legend><p>用户名：</p><p>密码：</p></fieldset>form 表单

<formmethod="POST"action="http://www.baidu.com"><inputtype="submit"value="submit"></form>一些补充

块级标签和内联标签

块级标签：<p><h2><table><ol><ul><form><div>

内联标签：<a><input><img><sub><sup><textarea><span>

block（块）元素的特点
① 总是在新行上开始；
② 高度，行高以及外边距和内边距都可控制；
③ 宽度缺省是它的容器的100%，除非设定一个宽度。
④ 它可以容纳内联元素和其他块元素

inline元素的特点
① 和其他元素都在一行上；
② 高，行高及外边距和内边距不可改变；
③ 宽度就是它的文字或图片的宽度，不可改变
④ 内联元素只能容纳文本或者其他内联元素

对行内元素，需要注意如下
设置宽度width 无效。
设置高度height 无效，可以通过line-height来设置。
设置margin 只有左右margin有效，上下无效。
设置padding 只有左右padding有效，上下则无效。注意元素范围是增大了，但是对元素周围的内容是没影响的。

额外知识点

　　1、border-collapse:collapse;如果可能，边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。

　　2、border-spacing:5px;border-spacing 属性设置相邻单元格的边框间的距离（仅用于“边框分离”模式）

　　3、caption 元素定义表格标题，caption 标签必须紧随 table 标签之后

　　4、clear:both，在左右两侧均不允许浮动元素。

　　5、<inputtype="radio"name="gender"value="male"checked>Male checked会默认选上

　　6、<option value="fiat" selected>Fiat</option> selected默认被选上的