css开始--＞选择器

1.css的固定格式

注意点：
style标签写在head标签中
style标签中的type属性其实不用写，默认为type=“text/css”

2.css中和文字相关的属性

规定文字样式的属性

格式：font-style:italic;
取值：normol(正常)、italic（倾斜）
快捷键：fs（font-style:italic;）；fsn（font-style:normol;）

规定文字粗细的属性

格式：font-weight:bold
数值取值：100-900整百取值
单词取值：bold（加粗）、bolder（加更粗）、lighter（细线）
快捷键：fwb（font-weight:bold）

规定文字大小的属性

格式：font-size:数字px
快捷键：fz取值（font-size）

规定文字字体的属性

格式：font-family
快捷键：ff（font-family）
注意点：如果取值是中文，必须用双引号或者单引号。设置的字体必须是用户电脑上安装的字体。

3.字体属性补充

a.如果设字的字体不存在，又不想用默认的宋体来展示，应该怎么做？

	设置备选字体。

	直接加在后面。

b.如果想给中文和英文单独设置字体，怎么办？

	英文在前中文在后。

4.css中的注释：/* hhh */

5.文字属性的缩写

	一个font后跟上所有属性，每个属性之间以空格隔开
	格式：font:style weight size family;

注意点：style，weight可以省略，也可以交换位置
size和family不可以省略，也不可以交换

6.css文本属性

文本装饰属性

格式：text-decoration:underline(下划线)
取值：underline（下划线）、line-through（删除线）、overline（上划线）none（什么也没有，还可以去掉超链接中自带的下划线）
快捷键：td

文本水平对齐的属性

格式：text-align：；
取值：cen ter，left，right；

文本缩进的属性

格式：text-indent：数字em；一个em代表一个缩进
快捷键：ti

7.颜色控制属性

格式：color：值；

取值：
7.1：英文单词

一般情况下颜色都有对应的英文单词，但不是所有

7.2：rgb

对应三原色（red、green、blue）
格式：rgb（0,0,0）
每个数值的取值范围是0-255，0代表不发光，255代表发光，值越大越亮。
例如：黑色（rgb（0,0,0））;白色（rgb（255,255,255））
红绿蓝三个的值都一样就是灰色，并且三个值越小就越偏黑色，越大就越偏白色。例如：rgb（200,200,200）

7.3：rgba

a是透明度，取值为0-1，取值越小越透明；rgb和前面一样

7.4：十六进制

每两位表示一个颜色。
例如#FFEE00，FF表示r，EE表示g，00表示b。
FF为255,00为0；

7.5：十六进制的缩写

例如：#FFEE00=#FE0
注意：如果两位数字不一样，就不能简写。

8.标签选择器

根据所制定的标签名称，在当前页面中找到所有该名称的标签，然后设置属性。

格式：
标签名称{
属性：值；
}

注意点：标签选择器选中的是当前界面中所有的标签，而不能单独选中一个标签，只要是html中的标签都可以作为标签选择器

9.id选择器

根据指定的id名称找到对应标签，然后设置属性。

使用id选择器前面必须有#，并且id的名称只能由字母/数字/下划线构成 ，不能以数字开头
id的名称不能是html中的标签名称。

10.类选择器

根据指定的类名称找到对应标签，然后设置属性。class=“类名”

注意点：

类选择器前面必须有.
并且类名只能由字母/数字/下划线构成 ，不能以数字开头。
类名可以重复。
类名是给某个标签专门设置样式的。

在html中每个标签可以同时绑定多个类名。
格式：< 标签名称 class=“类名1 类名2…”>

11.id和class的区别

	id不可以重复，class可以重复

	id独一无二，class可以有多个

	id以#开头，class以.开头

12.后代选择器

找到指定标签的所有后代标签，设置属性

格式：

注意点：
后代选择器必须用空格隔开，不只是儿子，还有孙子，重孙子。

13.子元素选择器

找到指定标签中的所有特定直接子元素，然后设置属性
格式：

注意：
子元素选择器要用>相连，并且中间不能有空格 、
可以通过>符号一直延续下去

后代选择器和子元素选择器的区别：

	后代选择器使用空格连接，子元素选择器使用>连接
	后代选择器会选中儿子孙子等等，子元素选择器只会选中儿子

后代选择器和子元素选择器的共同点：

	都可以使用id名称，标签名称，class属性来作为选择器。
	都可以通过各自的连接符号一直连接下去。

14.交集选择器（了解）

给所有选择器选中的标签中，相交的那部分标签设置属性。

格式：

选择器1选择器2{
		属性：值；
		}

注意：选择器和选择器之间没有任何的连接符号

15.并集选择器

给所有选择器选中的标签设置属性。

例如：

	.para1,.para2{
			属性：值；
			}

注意：并集选择器必须使用“，”来连接

16.兄弟选择器

相邻的兄弟选择器

给指定选择器后面紧跟的那个选择器选中的标签设置属性
注意点：只能用+连接，只能选中紧跟其后的标签

	格式：
	选择器1+选择器2{
				属性：值；
				}

通用兄弟选择器

给指定选择器后面的所有选择器选中的所有标签设置属性
注意点：只能用~连接，不管隔不隔开。

	格式：
	选择器1~选择器2{
			属性：值；
			}   

17.序选择器

同级别的第几个          
	选中同级别的第一个标签：first-child
	注意：不区分类型
	选中同级别的最后一个标签：last-child
	注意：不区分类型
	选中同级别的第n个标签：nth-child（n）
	注意：不区分类型
	选中同级别的第n个标签：nth-child（n）
	选中同级别的倒数第n个标签：nth-last-child（n）
	选中父元素中唯一的元素：only-child
	选种同级别中的所有奇数：nth-child（odd）
	选种同级别中的所有偶数：nth-child（even）
	nth-child（xn+y）：x,y是自定义的 

同类型的第几个
	选中同级别中同类型的第一个：first-of-type
	选中同级别中同类型的最后一个：last-of-type
	选种同级别中同类型的第n个：nth-of-type（n）
	选种同级别中同类型的倒数第n个：nth-last-of-type（n）
	选中父元素中唯一类型的某个标签：only-of-type
	选中nth-of-type(odd)

18.属性选择器

根据指定的属性名称找到对应的标签，然后设置属性。

18.1格式：

	[attribute]
	作用：根据指定的属性名称找到对应的标签，然后设置属性。

	[attribute=value]
	作用：找到有指定属性，并且指定属性等于value的标签然后设置属性。

18.2

	1.属性的取值是以什么开头的
		[attribute|=value]    CSS2
		[attribute^=value]    CSS3
	2.属性的取值是以什么结尾的
		[attribute$=value]    CSS3
	3.属性的值是否包含某个特定的值 
		[attribute~=value]    CSS2
		[attribute*=value]    CSS3

19.通配符选择器（一般不使用）

给当前界面上的所有标签设置属性

	格式：*{
			属性：值；
			}