前端html+css标签简介（可能就我自己看的懂-。-）

标签集合

# html

文字标签：修改样式
	-<font></font>
	-属性：size：大小，范围1-7，大于7时默认7
	       color：颜色，英文单词或者十六进制(editplus中有颜色工具)

注释标签：java注释有几种？3
	html注释：<!--   xxxxx此为注释   -->

标题标签：
	<h1></h1><h2></h2>...<h5></h5>
	<h1>标题一</h1>，可以自动换行，字体大小依次变小

水平线标签：<hr/>
	-属性：size：线的粗细
	       color：线的颜色
	<hr size="5" color="blue"/>

特殊字符：转义：
	< : &lt;
	> : &gt;
	& : &amp;
	空格 : &nbsp;

列表标签：<dl></dl>:表示列表的范围
	           <dt></dt>上层主内容
		   <dd></dd>下层子内容
	  <ol></ol>有序列表的范围
		   <li></li>具体内容
	  <ol type="a"></ol> type设置排序方式
	  <ul></ul>无序列表范围
	  <ul type="circle"></ul> type设置排序方式

图像标签：<img src="图片的路径"/>
	-src:图片的路径
	-图片的宽度
	-height:图片的高度
	-alt:显示图片上的文字，鼠标移到图片上停留片刻(有些浏览器不支持)

路径介绍：
	绝对路径：使用路径全名
	相对路径：1.从该html的同级目录的路径开始（同级或下层目录）
		2.用../回到上级目录出发（上层目录）

超链接标签：
	链接资源：<a href="链接路径">显示在页面上的内容</a>
	href:资源地址（#无效化）
	target:设置打开方式，默认在当前页面打开
		_blank:在新窗口打开
		_self:在当前页面打开
	定位资源：先定义一个位置
		<a name="example">ok</a>，回到该位置用链接
		引入标签pre,原样输出

表格标签：<table></table>:表格的范围
	tr：表格中的每一行；td：每一行的每一个单元格
	中有tr中有td:<tr><td></td></tr>
	属性：border：表格线的粗细
		bordercolor：表格线的颜色
		cellspacing：单元格之间的距离
		width和height：表格的大小
		align设置文字位置：left，center，right
	th：代替td并实现居中和加粗
	<caption></caption>:表格标题
	合并单元格：-rowspan：跨行
		-colspan：跨列 colspan="3"跨三列

表单标签：<form></form>:定义表单的范围，属性action提交数据，默认当前页面，属性method，get和post默认get，属性enctype，文件上传需用，下面每一项中要有属性：name
		输入项：<input type="类型"/>
		普通输入项：<input type="text"/>
		密码输入项：<input type="password"/>
		单选输入项：<input tye="radio"/>属性：name需一样，value，checked="checked"默认选中
		复选输入项：<input type="checkbox"/>属性：name需一样，value，checked="checked"默认选中
		文件输入项：<input type="file"/>
		下拉输入项：<select>
				<option value="1">1</option>
				<option value="2">2</option>
				...
			    </select>
				selected="selected"默认选中
		文本域：<textarea></textarea>属性cols（列），rows（行）
		隐藏项：<input type="hidden"/>
		提交按钮：<input type="submit"value="注册"/>
			<input type="image" src="图片路径"/>（图片提交）
		重置按钮：<input type="reset" value="重置"/>
		普通按钮：<input type="button" value="普通">

其他标签：<b></b>加粗
	<u></u>下划线
	<i></i>斜体
	<s></s>删除线
	<p></p>段落
	<pre></pre>原样输出
	<sub></sub>下标
	<sup></sup>上标
	<div></div>自动换行
	<span></span>在一行显示

头标签：<title></title>标题
	<meta name="keywords"content="关键字">搜索引擎
	<meta http-equiv="refresh" content="时间；url=地址">多少时间后跳转到该地址
	<base target="_blank">所有链接都在新窗口打开
	<link>引入外部文件

框架标签：<frameset></frameset>
	-rows：按行划分<frameset rows="80,*">分两部分，第一部分80
	-cols：按列划分
	<frame name=""src="">
	只有在没有body是能用





# css


1.直接在每个标签后加style

2.<style type="text/css">
	div{
		background-color:blue;
		}
 </style>

3.在style标签里导入css文件（有些浏览器不起作用）
	@import url(路径);

4.使用link引入外部文件
	<link rel="stylesheet" type="text/css" href="css文件的路径"/>

由上到下，从外到内，优先级低到高

标签选择器
	div{
		background-color:red;}
class选择器
	<div class="x">aa</div>
	.x{background:red;}
id选择器
	<div id="y">aa</div>
	#y{backgeound:red;}

style优先级大于id选择器优先级大于class选择器优先级大于标签选择器

扩展选择器：
	关联选择器div p{...}嵌套时使用
	组合选择器div,p{...}设置相同样式时使用
	伪元素选择器：css中一些定义好的样式
		a:link{background-color:red}
		：hover：active：visited

css盒子模型：
	边框：border:20px  soild  blue(大小，类型，颜色)
		top,bottom,left,right四种
	内边距：padding:20px
		上下左右分别设置
	外边距：margin:20px
		上下左右分别设置

css布局定位与漂浮：
	float：left和right放到对象左边或右边
	position：absolute：把对象从文档流拖出，可以用top，bottom等定位
		relative：不从文档流拖出，用top，bottom定位