1.CSS概念

CSS：Cascading Style Sheets，层叠样式表或者级联样式表，主要用于设置HTML页面中的文本内容、图片外形以及版面的布局等等外观样式。

2.CSS样式规则

选择器 {属性:值}
注意：属性和属性值是以键值对的形式出现，属性与属性值之间用英语的":“隔开，多个键值对之间用英语的”;"隔开。

3.CSS的字体样式

font-size ：设置字体的字号，属性值单位常用的是px，也可以使用绝对的长度单位，比如：cm,mm,pt,in等等。
font-family：设置字体，网页中常用的字体有宋体，微软雅黑，黑体等等，使用css样式可以设置字体的类型。如果需要设置多个字体，中间用逗号隔开，表示浏览器不支持第一个字体，则会尝试下一个，直到找到合适的字体。
Unicode字体：在CSS中设置字体，直接使用中文名称即可，但是在文件编码不匹配的时候会产生乱码的错误，这个时候可以采用英文名称或Unicode字体。
常用字体的英文名称和Unicode编码
宋体 SimSun \5B8B\4F53
黑体 NSimSun \65B0\5B8B\4F53
微雅软黑 Microsoft YaHei \5FAE\8F6F\96C5\9ED1
字体的英文名称和Unicode编码可以在CSS手册中查询。
font-weight：设置字体的粗细，字体加粗除了可以使用b和strong标签之外，还可以使用CSS来实现，但是CSS是没有语义的。
font-weight的属性值：normal，bold,bolder,lighter,100-900中100的整数。
font-style 字体风格，字体倾斜除了使用i和em标签外，还可以使用font-style来实现。
font-style的三个属性值 normal italic oblique，font-style可以使用normal属性将斜体字体改为普通模式。
font属性对字体的综合设置
选择器{font:font-style(斜体) font-weight(粗体) font-size(字体大小)/line-height(行高) font-family}
注意：使用font属性必须按照上面的格式和顺序，不能更换顺序，各个属性使用空格隔开，斜体和粗体可以省略，但是必须保留font-size和font-family，否则font属性不起作用。

  <style>
            h1 {
                font-family: inherit;
                font-style: italic;
                color:#00EEEE;
                text-align: center;
            }
            b {
                font-weight: normal;/*将粗体改为正常  font-weight:normal/400;*/
            }
            em {
                font-style: normal;/*将斜体改为正常 font-style:normal*/
            }
            p {
                font-size: 14px;
                text-indent: 2em;/*首行缩进2个汉字*/
                line-height: 23px;
                letter-spacing: 1px;
                word-spacing: 3px; /*英文单词之间的间距*/
            }
            div {
                font-size: 50px;
                font-weight: bold;
                color: rgba(255, 0, 0, 0.5); /*文字阴影效果*/
                text-shadow: 11px 4px 5px rgba(255, 0,0, 0.2);
            }
        </style>

4.字体样式使用技巧

1.网页中的字体大小普遍使用14px++；
2.设置字体大小的时候，尽量使用偶数，奇数有些浏览器可能会出现bug。
3.字体类型使用英文时不用加上英文的双引号，但是使用带有空格、#、$的英文、中文或者Unicode编码需要使用英文状态的双引号。
4.尽量使用系统默认的字体，微雅软黑或者宋体。
5.页面字体尽量少用斜体，会影响阅读，通常使用font-style:normal;将字体改为普通模式。

5.外观属性

color：文本颜色，取值方式：预定义的颜色值（颜色的英文单词）、十六进制、RGB, 通常采用十六进制,可以使用在线取色器查找相关颜色的十六进制。
line-height ：行间距使用最多的单位是px，一般情况下，行距比字号大7,8个像素即可。
text-align ：文本内容的水平对齐方式，属性值：left，center，right。
text-indent：首行缩进对文本内容设置首行缩进，使用单位通常为em，1em就是一个字的宽度，1em就是一个汉字的宽度。
letter-spacing ：字间距，就是字符与字符之间的空白。
word-spacing：单词间距，定义英文单词之间的间距，对中文字符无效。
颜色半透明 color:rgba(r,g,b,a) a:alpha 透明的意思，取值范围在0-1之间 r,g,b只能取值为RGB代码0-255 不能为十六进制。
文字阴影 text-shadow:水平位置垂直位置模糊距离阴影颜色其中水平位置和垂直位置是必需属性，不可省略。

来源：CSDN

作者：淡忘～雨季

链接：https://blog.csdn.net/weixin_43900407/article/details/104079496

标签

css