這是我自己返回網頁看了看，總結的一些知識點，應該比較全面了

一、HTML
1、歷史特性：
（1） HyperText Markup Language超文字標記語言，是一門標記語言。2010年正式推出HTML5，HTML是製作網頁的基礎語言，主要用於描述超文字中內容的顯示方式。
（2）XHTML:可擴充套件超文字標記語言，優點：可擴充套件性和可移植性
  XML   :可擴充套件標記語言
 （3）超文字：使用超連結的方法把不同空間的文字資訊組織在一起的網狀文字。
2、網站站點建立：
（1）網頁資料夾和檔案的命名規範：字母數字下劃線組成且不以數字開頭。
（2）站點建立：站點資料夾：web-01；
站點資料夾下的資料夾：css	,  html  ,  images(Flash,js這兩個目前還不用)
資料夾下的檔案：style.css   ,   index.html   ,img
（網頁副檔名可以為：.html，.htm都可以）

（3）網站：用於展示相關內容的網頁的集合
3、網頁分類：
網頁：網站中的任一頁面。
靜態網頁：html/htm 動態網頁：.asp，.jsp，.php
4、w3c標準：結構（Structure）、表現（Presentation）、行為（Behavior）
w3c:World Wide Web Consortium

結構：用於結構化的Web標準化技術主要由：Html、Xhtml、Xml。
表現：主要指CSS。
行為：表現行為的標準技術主要有：DOM和Javascript。Dom是一種讓瀏覽器和Web內容結構溝通的介面，javascript主要是用來操作DOM的。
表現和內容分離是Web標準的核心。
5、html標籤
（1）是HTML最基本的單位。
（2）注意事項：
標籤可以巢狀使用，但不可以交錯使用
在設定標籤屬性值時一般使用引號（單引號或雙引號都可以），但引號也可以省略。不過按照w3c的的規範，最好為每一個屬性值加上引號。
HTML中標籤名稱，屬性名，屬性值大小寫不敏感，但從視覺上的體驗來說，一般用小寫。屬性不能在結束標籤中。
在css中:
- id名和class名是區分大小寫的
- 選擇器中，只有標籤選擇器不區分大小寫
- 屬性名和屬性值是不區分大小寫的
屬性和屬性值
屬性：標籤的特徵；
屬性值：屬性的值。
（3）分類：雙標籤和單標籤
（4）網頁佈局



二、標籤
1、標題標籤 <h1-6></h1-6>
	<h1>最大</h1>
	<h2>啊啊</h2>
	<h3>啊啊</h3>
	<h4>啊啊</h4>
	<h5>啊啊</h5>
	<h6>最小</h6>
2、文字標籤
	段落標籤：<p></p>
	加粗：<b></b>
	加粗強調：<strong></strong>
	傾斜：<i></i>
	傾斜強調：<em></em>
	下劃線：<u></u>
	中線/刪除線：<s></s>
	雙引號英文：<q></q>
	換行：<br/>
	水平線：<hr/>
屬性：
	width:20px;
	  size:1px;
	 color:red;
	 align:(left,center,right)

2、特殊符號
	空格：&nbsp;			&nbsp;是在網頁中新增一個半形空格。
	小於<：&lt;
	大於>：&gt:
	版權：&copy;			copyright
	註冊：&reg;			register
	引號“ " ”:&quot;
	   &	:&amp;
	•  ：&bull
3、圖片 <img/>
	屬性： 路徑src=""		
	寬度width=""
	高度height=""
	路徑錯誤提示alt=""
	滑鼠游標提示內容title=""
4、列表
	有序列表ol>li
	type= "disc(預設),circle,square"
	無序列表ul>li
	type="1(預設) ,a ,A ,i ,I"  			* 不可以為其他的值
	start=""
	reversed						*不需要屬性值
	自定義列表dl>dt(定義列表中的專案) dd（描述列表中的專案）

5、a標籤<a></a>
	屬性：
	href=”#” 連結路徑
	target="_blank,_self,_parent,_top " 	*開啟方式
	*注意：
	（1）超連結是一對一的關係。
	（2）連結網址必須要有http。
	（3）特點：a.可連結的物件可以是行內元素，也可以是行內塊元素，也可以是塊元素
	常用：href=""(郵件：mailto:
 
[email protected]; )參考：http://note.youdao.com/noteshare?id=d083baf89b7bdc700e749eb5a24fbd20&sub=567AE89724904F6187EE98852567D186

6、表格<table></table>
（1）<table> </table>
		屬性：width=""
		height=""
		bgcolor=""
		border=""
		bordercolor=""
		background=""
		align=""
		border-collapse=”collapse”;     	（CSS）單元格間隙合併
		cellspacing=""					  單元格間距，預設值是2px;
		cellpadding=""				 	  單元格內容與單元格邊框的距離
		  
（2）<tr> </tr>	
		屬性：align="";
		valign="";
		bgcolor="";
（3）<th> </th>（和 td 屬性一樣）
（4）<td></td>	
		屬性：align="left,center,right,justify";
		valign="top,middle,bottom,baseline";
		colspan="";
		rowspan="";

*注意：
	（1）表格特性:
	資料展示。
	更直觀清晰的告知使用者對應資料資訊。
7、表單<form> </form>
（1）<form> </form>
		action=”提交的地址，網址” 			提交地址
		method="get/post"    				提交方法
		target="_blank,_self（預設）"			開啟方式

（2）<intput> </input>
		屬性：
		type="text文字框，
		password密碼框，				*password中的value顯示影藏，place holder顯示正常
		radio單選，
		checkbox複選/多選，
		submit提交，
		reset重置，
		button按鈕，
		image圖片，
		file檔案域，
		hidden隱藏
		disabled禁用input元素"
		checked="checked"  預選定
		disabled="disabled"   應該禁用的元素
		readonly		規定輸入欄位是隻讀的
		name		元素的名稱
		placeholder     提示資訊（虛）
		src       插入圖片的路徑
		step   元素的合法數字間隔
		max   最大值
		min    最小值
		value  元素的value值（實，文字就存在了文字框或者按鈕內）
		width   height只針對插入圖片的寬高
		placeholder 提示（虛，滑鼠點進文字框，提示資訊不消失，輸入文字時，提示資訊消失）
		預設值：獲取焦點和失去焦點預設值，以下圖片

（3）下拉列表select>option
		<select></select>
		name=""
		id=""
		multiple=”multiple”			多選
		size=""					多選的數量
		<option></option>
		selected=”selected”			預設選項選擇
		<textarea></textraea>
		cols=""					文字寬度
		rows=""					文字高度

 		* 注意：
（1）表單特性：
		資料互動。
		定義屬性表現。
（2）按鈕的type型別：button，reset，submit，image
三、CSS樣式：Cascading style sheets

1、功能：用於控制網頁的外觀。用於將格式與結構內容分離（html控制結構內容，css控制格式）。
2、選擇器：
（1）全域性選擇器（萬用字元選擇器）:
（2）標籤選擇器：
（3）類選擇器：
（4）ID選擇器：
（5）偽類選擇器：
（6）層級選擇器：
（7）群組選擇器：
3、樣式：
（1）行內樣式：
（2）內嵌樣式：
（3）外部連結樣式；
（4）匯入樣式：
* 樣式表的分類：行內樣式表 >內部樣式表>外部樣式表  (優先順序)
行內		內嵌		外鏈和匯入
4、文字屬性：
	color：										顏色
	font-size：									字型大小
	font-family：									 應用字型
	font-weight:bold | bolder | 100-599 | 600-900 | normal;	字型加粗

5、段落屬性：
	text-decoration:underline | overline | line-through | none;文字修飾
	text-align:									水平對齊方式
	text-indent:24px | 2em | 50% | 負值 ；				文字縮排
	line-height: 25px | 50% | 2 (size的正數倍);			文字行高

6、背景屬性
	background-color:											背景顏色
	background-image:（預設屬性值為none）|url()|inheit									背景圖片
	background-repeat:repeat（預設值） | no-repeat | repeat-x | repeat-y。背景重複
	background-position:x,y;										背景圖片位置
	x:left,center,right | 100px | 50%								
	y:top,center,bottom | 100px | 50%
	background-attachment: scroll(隨滾輪動) | fixed  					滾動圖片|固定圖片 
	background-size:length | percentage | cover | contain;背景圖片大小（寬，高），一般獨立於複合屬性單寫。
*注意：
（1）可以這樣寫：50% center;不可以這樣寫：top ，right
（2）注：先寫x方向，再寫y方向，不能反著來。取值可以是：關鍵字（上面就是）、數值、百分比。）
（3）background-attachment: scroll(隨滾輪動) | fixed（不隨滾輪動）;定義背景圖片隨滾動軸的移動方式.fixed是背景圖的固定。
（4）注：百分比是相對父級;cover是長寬等比覆蓋背景就是父級最長邊被覆蓋,contain是長寬等比父級最小邊被覆蓋。

7、列表屬性
	ul,ol,li{	list-style:none; 								清除列表前面的預設type；
	list-style-image:url() | none(預設) | inherit;  			列表前面放圖片
	list-style-type:square|none |disc |circle | decimal | none ;		列表型別
	list-style-position:inside | outside | inherit；			列表的型別放置在了padding中為40px;
	}
   
*注意：
（1）如果設定了一個li的list-style-type:none;那麼後邊的li還是原來的順序數，前後不會改變。

8、邊框屬性border
	width:預設3px;													寬度
	style: dotted 點線| dashed 虛線| solid 實線| double 雙線| none 取消線		樣式
	color:name | RGB | hex (16進位制值) | transparent						顏色
	
	*注意：
	（1）這三個屬性只有width不寫時有預設值，其餘兩style ，color必須寫才會出現不可。也可以border-top | border-top-color 等。
	（2）所以border線消失的方法：a.border-width:0;
	  b.border-width:0px;
	  c.border-style:none;

9、內邊距
	padding:   12px;
	padding-top,right,bottom,left:    auto  |   12px;

10、外邊距
	margin: 12px;
	margin-top,right,bottom,left:  auto | length | percentage;

11、overflow

	值 描述
	visible 預設值。內容不會被修剪，會呈現在元素框之外。
	hidden 內容會被修剪，並且其餘內容是不可見的。
	scroll 內容會被修剪，但是瀏覽器會顯示滾動條以便檢視其餘的內容。
	auto 如果內容被修剪，則瀏覽器會顯示滾動條以便檢視其餘的內容。
	inherit 規定應該從父元素繼承 overflow 屬性的值。

四、盒子模型屬性：
	一共就四個：margin、padding、border、content（width，height）（寬高是盒子的寬高，不是文字的寬高；只會考這四個，不會出margin-right這樣的）

五、浮動
	float: left(元素順序顯示) | right（元素倒序顯示） | none;
	清除浮動：
	clear:both | left | right | none | inherit .

	*注意：清除浮動只是指clear;

六、行內元素、行內塊元素、塊元素
轉換：display:inline | inline-block | block | none(消失，不佔空間);

行內元素有：heda   meat   title  label  span(用於文字位元組)  br  a   style  em  b  i   strong

塊級元素有：body  from  select  textarea  h1-h6  html  table  button  hr  p  ol  ul  dl  cnter  div

行內塊元素常見的有： img  input  td  （img input 也屬於行內元素）

七、定位
	position：屬性：
	預設定位：static（預設）
	絕對定位：absolute			相對於具有定位屬性的父級元素的定位
	相對定位：relative			相對於本身原來的位置進行定位
	固定定位：fixed			相對於網頁視窗進行定位
	left:(比right優先)  50%  |  14px   ;
	top:（比bottom優先）  50%  |  14px   ;
	right: ；
	bottom: ；
	z-index:;   				 z軸上的相對位置，用整數。值越大越靠上。	
	*注意：
	（1）fixed固定定位和absolute絕對定位都會脫離原來的位置進行定位，到了不同的層面。
		（2）absolute絕對定位會追溯有定位屬性的父級，如果沒有，會相對於文件定位。
		（3）如果讓一張圖片fixed在網頁正中間，用
	left:50%；
	top:50% ; 
	margin-left:-1/2width ;
	margin-top:-1/2height;

八、DIV
<div></div> 
（1）兩個div的margin-bottom和margin-top可以共用空間,兩者間距為最大值。
兩個行內（包括行內塊）元素的左右margin-right  ，margin-left不可以共用空間，所以兩者間距離=margin-right +  margin-left;
（2）補充屬性：
	opacity:[0,1]; 透明度
	vertical-align:top | middle |bottom |baseline | 數值;（middle和數值常用）
	color:rgba(_,_ ,_,0.5);   設定字型顏色透明度
	line-height=div.height;  設定文字垂直方向對齊
	font-size:20px;		設定的四字型的高度
	letter-spacing		文字文字間距
	border-radius:;
	transition: opacity  2s;
	word-break: normal|break-all|keep-all;  自動換行
	word-wrap: normal|break-word;


九、優先順序
	下列是一份優先順序逐級增加的選擇器列表：
	通類選擇器		 0 
	元素（型別）選擇器 1 | 偽元素span::before span::after	
	類選擇器 	 		10
	屬性選擇器
	偽類
	ID 選擇器			 100
	內聯樣式 			1000
	!important

	第一等：代表內聯樣式，如: style=””，權值為1000。 
	第二等：代表ID選擇器，如：#content，權值為100。 
	第三等：代表類，偽類和屬性選擇器，如 .content，權值為10。 
	第四等：代表標籤選擇器和偽元素選擇器，如 div、p，權值為1。 
	第五等：通用選擇器（*），子選擇器（>），相鄰選擇器（+）和後代選擇器權重值為0。 
	權值疊加使用。
	
	*CSS之派生選擇器（上下文選擇器）：後代選擇器(p a 層級選擇器)，子選擇器（p>a），相鄰兄弟選擇器（h2+h）


全域性：
	*{ padding:0; margin:0 auto; font-size:15px; font-family:"宋體"; }
	body,p,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,table,tr,td,form,input,select,textarea,span,img,a,em,strong{ margin:0; padding:0; }
	ul,ol,li{ list-style:none; }
	h1,h2,h3,h4,h5,h6{ font-size:14px; }
	input,select,textarea{ vertical-align:middle; }
	img{ border:none; vertical-align:middle; }
	a{ text-decoration: none; color:black; }
	a:hover{ text-decoration: underline; color:blue; }
	.clear{ clear:both; }



	box-shadow: 100px 50px 200px #foo ;
	( 1、水平偏移距離
	2、垂直偏移距離
	3、輻射半徑
	4、陰影顏色
	5、inset 內陰影，)