CSS样式基础（一）

CSS的基本概念

Cascading style sheet层叠样式表

选择器

标签：**

类：（class）：class名字 使用方式：输入点+class名

ID：id名 使用方式：输入#+id名

一般来说我们写css文件的时候用的都是第二种选择器，class名

这是因为ID名一般被用作js的选择器

给class命名也是规范的，像xxx-xxxx这样的好处是让你的代码更清晰，别人也更容易看懂

三种连接样式

行内样式（内嵌样式）：

直接写在标签里，使用style属性，只对当前标签有效，页面内容和表现形式是高度耦合的，不利于分工合作。

内部样式（内连样式）：

内部样式是在head部分使用<style标签，样式对当前页面有效，内容和表现形式实现了一定程度的分离，但不彻底。

外部样式（外连样式）：

需要一个link标签来与HTML连接起来，内容与表现形式完全分离，而且任何需要用到改样式的页面都可以通过link标签连接的方式来实现。

字体相关属性

Text-align**（对齐方式）：center（居中）/left（靠左）/right（靠右）

Font-size**（字体大小）：56px/24px /多少px

Font-family**（字体体系）：“黑体/宋体”

Font-style（是否倾斜）：italic（倾斜）/normal（正常）

Font-weight（字体粗细）：100/200/normal （400）/bold（700）/bolder

Font-variant（是否大写）：normal/small-caps（小型大写）

Color（字体颜色）：blue/red/pink/black/green/ #FFFFFF/#F6F6F6/

Text-decoration**：none（默认格式）/underlie（下划线）/overline(上划线)/line-through（删除线）*

Direction：LTR(从左到右)/RTL(right to left 从右到左)

Text-transform：none（默认）/capitalize（首字母大写）/uppercase（全部大写）/lowercase（全部小写）

Line-heigh（行高）：normal/多少px

Letter-spacing（字符间距）：2px/5px/多少px

Word-spacing（单词间距）：normal/2px/px/多少px