CSS基础1

1、CSS简介

css 是层叠样式表( Cascading Style Sheets)的简称，有时我们也会称之为 CSS 样式表或级联样式表。CSS是也是一种标记语言。由 HTML专注去做结构呈现，样式交给CSS，即结构(HTML)与样式(CSS)相分离。

CSS 规则由两个主要的部分构成：选择器以及一条或多条声明。

 2、CSS 代码风格

紧凑格式

h3 { background-color: pink;font-size: 20px; }

展开格式

h3 {

        background-color: pink;

        font-size: 20px;

}

3、CSS基础选择器

选择器(选择符)就是根据不同需求把不同的标签选出来这就是选择器的作用。简单来说，就是选择标签用的。

基础选择器

选择器分为基础选择器和复合选择器两个大类，

• 基础选择器是由单个选择器组成的
• 基础选择器又包括：标签选择器、类选择器、id 选择器和通配符选择器

id 选择器 和 类选择器的区别

• 类选择器(class)好比人的名字，一个人可以有多个名字，同时一个名字也可以被多个人使用，
• id 选择器好比人的身份证号码，全中国是唯一的，不得重复
• id 选择器和类选择器最大的不同在于使用次数上。
• 类选择器在修改样式中用的最多，id 选择器一般用于页面唯一性的元素上，经常和 JavaScript 搭配使用

在CSS中，通配符选择器使用 "*" 定义，它表示选取页面中所有元素(标签)

复合选择器

4、CSS 字体属性

属性	表示	注意点
font-size	字号字体	我们通常用的单位是px 像素，一定要跟上单位
font-family	字体	实际工作中按照团队约定来写字体
font-weight	字体粗细	记住加粗是 700 或者 bold 不加粗是 normal 或者 400 记住数字不要跟单位
font-style	字体样式	记住倾斜是 italic 不倾斜 是 normal 工作中我们最常用 normal
font	字体连写	1.字体连写是有顺序的 不能随意换位置 2其中字号和字体 必须同时出现

• CSS使用 font-family 属性定义文本的字体系列。
• CSS 使用 font-size 属性定义字体大小。
• CSS使用font-weight 属性设置文本字体的粗细。
• CSS 使用 font-style 属性设置文本的风格 normal 浏览器默认值，italic 显示斜体的字体样式。

p {

        font-size: 20px;

        font-style: italic;

        font-family: 'Times New Roman', Times, serif;

        font-weight: bold;

}

复合属性：简写的方式

font: font-style font-weight font-size/line-height font-family;

• 使用 font 属性时，必须按上面语法格式中的顺序书写，不能更换顺序，并且各个属性间以空格隔开
• 不需要设置的属性可以省略(取默认值，但必须保留 font-size和 font-family 属性，否则 font 属性将不起作用

5、CSS文本属性

color 属性用于定义文本的颜色。

text-align 属性用于设置元素内文本内容的水平对齐方式

属性	表示	属性值
color	预定义的颜色值	red，green，blue，还有我们的御用色 pink
	十六进制	#FF0000，#FF6600，#29D794。开发中最常用的是十六进制
	RGB代码	rgb(255,0,0)或rgb(100%,0%,0%)
text-align	左对齐(默认值)	left
	右对齐	right
	居中对齐	center