css_day1

一、CSS层叠样式表

主要用于设置HTML页面中的文本内容（字体、大小、对齐方式等）；图片的外形（宽度、边框样式、边距等）以及版面的布局和外观显示样式。

二、引入CSS样式表（书写位置）

1、行内式（内联样式）：写在标签的内部，只能影响到当前的一个标签。
2、内部样式表（内嵌样式）：在head标签中写style标签，在style标签中写css样式代码，内嵌式的影响范围：影响到一整个页面。
3、外部样式表（外链式）：所有的页面都可以使用同一个外链式css文件
影响范围：整个网站————也是工作中用得最多的方式

三、字体相关属性

1、控制文字的大小 font-size：
1.以px为单位
2.em单位 em是默认字体大小的倍数
3.谷歌默认的字体大小是16px，默认的最小字体是12px 2、控制文字的字体库 font-family：默认的字体是微软雅黑
3、控制字体是否加粗 font-weight
normal 正常 就是不加粗—400
bold 文字加粗—700
4、控制字体是否倾斜 font-style：
normal：正常不倾斜
italic：字体倾斜
5、关于font的连写 font：bold italic 100px “宋体”
连写属性的顺序问题
1.前面两个可以掉换位置，还可以省略----字体加粗和字体倾斜
2.后面两个不能掉换位置，不能省略，必须先写字体大小，再写字体库

四、文本颜色设置

1.使用颜色英文单词 但是范围太小，工作中使用较少
2.使用rgb方式设置颜色 所有的颜色都是由三原色按照不同的比例调配出来的
比例的范围：0-255
3.十六进制表示法 #ff0000——红色
在十六进制中，每两位数代表一个原色
前面两个是红色，中间两个是绿色，后面两个是蓝色
是工作中用的最多的方式

文本水平与垂直对齐方式

1.text-align: 控制文本的水平对齐方式：left center right
2.line-height: 行高，控制文本在垂直方向的位置
如果想让文字垂直居中
让文字的行高等于容器的高度即可

文字相关外观属性

1.text-indent： 100px 控制文本首行缩进100px
2em 控制文本首行两个文字
2.text-decoration: none 没有线 将a标签自带的下划线消除

CSS选择器

1.选择器的作用：让样式可以作用到目标元素上。
2.标签选择器：根据标签名找到目标元素
标签名{
属性名：属性值；
…
…
}
3.类选择器：类就相当于人的名字
给标签取一个名字————类名 class
类名可以有多个————多个类名之间用空格隔开
类名可以重名
类选择器谁使用谁改变
4.id选择器：id是标签的唯一标识
标签只能拥有一个id
而且不能重名
5.通配符选择器： 可以一次性控制页面上所有的标签
*{
color: red;
}