前端css基础

基本标签组合

名称 语法 说明 示例

直接组合 AB 满足A的同时满足B input:focus
后代组合 A B 选中B，如果他是A的子孙 nav a
亲自组合 A>B 选中B，如果他是A的子元素 section>p
兄弟选择器 AB 选中B，如果它在后的后面或者与A同级 h2p
相邻选择器 A+B 选中B，如果它紧跟在A后面 h2+p
rgb(红，绿，蓝)根据比例来调节颜色 rgba(红，绿，蓝，透明度)透明度取值范围为0-1 当然opacity也可以设置透明度，取值范围也为0-1

颜色-HSL

H即为HUE，色相(H)是色彩的基本属性，如红色，黄色等；取值范围是0-360.

Saturation 饱和度(S)是指色彩的鲜艳程度，越高越鲜艳；取值为0-100%，为0时为灰色

Lightness 亮度(L)指颜色的明亮程度；越高颜色越鲜艳；取值范围是0-100%

字体

font-family:字体一，字体二，字体三 这样做的目的是因为有些浏览器不兼容一些字体，比如你的浏览器不兼容字体一，那么那就用二，如果也不兼容二，那么就用三。。。。。

字体大小font-size
指定字体大小的三种方式：

关键字
small，large，medium

长度
px，em

百分数
相对于父元素字体大小

字重 font-weight

font-weight:数值 数值可以为100、200、、、、当然不同的字体的字重范围不一样

####行高 line-hight 致命两行文字之间最下侧之间的距离，一般应用与设置字体居中，比如一个div的高度就是50px，那么你设置字体的行高为50px那么他就会居中，行高大于50px就会往下偏

white-space 处理空格与换行

nomal:忽略多余的空格，只保留一个空格，默认会换行
nowrap:只保留一个空格，不会换行，直到遇见br换行标签
pre: 保留空白
-pre-line:合并空白符序列，保留换行符

inherit:从父元素继承过来white-space