CSS基础知识复习一

一.什么是CSS，以及为什么使用CSS

	1.英文：Cascading Style Sheets，称为层叠样式表。
	2.为了更好地美化网页。
	3.多余的标签属性会使页面显得比较臃肿。

二.怎样引入，以及如何书写CSS

	1.有三种引入方式
		行内样式表：没有实现样式结构相分离，适用于单个标签。在开始标签内书写，且为h1标签里的字体改变了颜色，代码如下。

<h1 style="color:red">这是一个h1标签</h1>

	    内部样式表：没有彻底实现样式结构相分离，适用于多个标签。head标签里写style标签，并在style标签里书写CSS属性，如代码改变了h2标签字体颜色。

<style>
    h2 {
      color: blue;
    }
</style>

		外部样式表：多个文件都可以引入，推荐使用这种方法。在head标签里，引入外部CSS文件，html里使用link标签，通过设置rel 属性指定当前文档与被链接文档的关系，最后，使用href填写引入文件的路径。

<link rel="stylesheet" href="css/style.css">

h3 {
  color: green;
}

	2.书写CSS，以及书写规范
		属性名：属性值。其中冒号后与属性值之间有空格。
		选择器名称和花括号回家爱你也有个空格，如代码。

h2 {
      color: blue;
}

三.CSS字体和外观属性复习

	1.font-size：字体大小属性，用像素做单位。
	2.font-weight：表示字体是否加粗，可以用100~900，或者bold，整百数来表示。
	3.font-family：字体属性，可以用英文和中文表示。
	4.font-style：是否倾斜。
	5.color：字体颜色，有三种表示方法，英文表示法，rgb表示法，16进制表示法，如代码。

color: red;
color: rgb(255,0,0);
/*   0~255,代表颜色不断加深  */
color: #ff0000;
/*   0~9以及a/A~f/F 代表颜色不断加深 */

	6.text-align:表示元素或者属性的位置，做左，中，右。
	7.font:字体综合设置，顺序是，是否倾斜  是否加粗  像素大小  哪一种文字。

四：选择器类型

	1.基础选择器：
		标签选择器：html的标签，也可以说是元素
		类名选择器：
			CSS文件里：.名称 {}
			HTML文件里：class="名称"
		id选择器：
			CSS文件里：#名称 {}
			HTML文件里：id="名称"
		通配符选择器
			* {}
	2.复合选择器：
		交集选择器：多个选择器的公共部分 
			方式：h3.类名。这就是h3标签和某个class的交集
		并集选择器：
			方式：代码如下：

h3,
.color {
	color: red;
}

		子代选择器：
			方式：类名/标签>类名/标签  {}，这种方式只能辐射到儿子一代，其它代后代，无法辐射。当然，继承属性不在此列。
		后代选择器：
			方式：类名/标签    类名/标签  {}。这种方式，最好只涉及三代。
	3.伪类选择器：
		类名/标签：link  {}，点击之前。
		类名/标签：hover  {}，移动至元素上。
		类名/标签：active  {}，点击时。
		类名/标签：visited  {},访问过。
		这些伪类全部可应用于a标签。但是link和visited不能应用于普通标签，其它伪类可以。

五.标签/元素类型

	1.块状元素
		元素：h1-h6/p/div/ul/ol/li/dl/dd/dt/table/thead/tbody/caption/tr/td/form
		特点：
			有默认宽高，宽为父元素的100% ,默认高度为内容所撑起的高度。
	        宽和高可以设置值。
	        独占一行。
	        可以包含任意元素，但是h标签不能包含h标签,h标签不能包p元素，p标签不能包含其它块状元素。
	        块元素的外边距和内边距可以设置 。
	2.行级元素
		元素：span/b/strong/i/em/u/ins/s/del/a
		特点：
			默认宽高，宽和高都是自身撑起来的。
	        不能设置宽和高。
	        相邻的行内元素在一行显示。
	        行内元素只能嵌套行内元素。
	        水平方向上的外内内边距可以设置。
			
	3.	行内块元素
		元素：img/br/input/textarea/select/option 
		特点：
			默认宽和高。
	        宽和高可以设置。
	        相邻的行内元素或者行内块元素在一行上显示。
	        一般不包含其他元素。
	        外边距和内边距可以设置。
	4.行内元素，块状元素以及行内块元素的转换。
		方式：通过display属性，可以设置，block/inline/inline-block，把它变为相对的，块状元素/行内元素/行内块元素。