CSS常用样式 | 零基础学HTML（七）

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第15天，点击查看活动详情

• css中的颜色值color

  • 十六进制的写法是根据rgb每个颜色转换来的，每个颜色值书写为两位的十六进制数：0 – 00  255 – ff
  • 十六进制颜色值简写模式：如果红绿蓝三个原色的色值每一个都是由重叠数字组成，可以将重叠的数字简化成一个进行书写。红色：#f00；绿色：#0f0；蓝色：#00f。类似#808080是不能简化的

• 字体font-family

  • 常用的中文字体：宋体（SimSun）、微软雅黑（Microsoft Yahei）

  • 常用的英文字体：Arial、consolas

  • 字体名称需要用双引号包括起来；一个字体可以有多个属性值，可以添加英文字体和中文字体

  • 浏览器加载字体的内部过程：font-family可以设置多个字体名称，在实际加载时只会选择一种加载，选择的依据是按书写顺序进行，如果浏览器不支持第一个字体，则会尝试下一个，直到找到第一个支持的字体

  • 此外，浏览器中加载的字体是用户机器中自带的，如果用户的电脑没有设置字体则会加载失败，需要查找下一个，因此，必须在最后设置一个所有机器都具备的通用字体作为后路

  • 而且，中文字体中一般都带有英文可以加载的字体效果，为了避免对英文字的字体影响，建议将英文字体写在属性值最前面

• 字号font-size

  • 如果HTML中不设置字号，不同的浏览器有自己默认的加载字号，比如Chrome、IE，默认显示字号为16px

  • 不同的浏览器也有也有自己最小加载显示字号，如果设置的字号低于最小字号，都以最小字号加载，0除外。Chrome浏览器最小加载显示字号为8px，IE浏览器最小可以支持1px的字号

  • 实际应用：

       - 网页中最小设置字号必须是12px，如果低于12px会出现兼容问题。现在网页中普遍使用14px+；尽量使用12px、14px、16px等偶数的数字字号，IE6等老式浏览器支持奇数会有bug

• 粗细font-weight

  • 属性值有两种方式：单词类型、数字类型（100-900之间的整百数字，其中400等价于normal，700等价于bold）

• 字体风格font-style

  • 作用：设置文字是否倾斜显示；属性值：单词

• 行高line-height

  • 作用：设置的是一行文字实际占有的高度，文字字号在行高中是垂直居中的（上下距离相等）

  • 属性值：px像素值和百分比数值（参考设置的本身字号像素值的百分比）

• 字体综合写法font

  • 只有包含两个及以上才能使用这种方法，但是需要特定的书写顺序

       - e.g. font: 15px “宋体”;

• 当字号和行高在一起书写时，中间需要用/分隔，而不是空格

       - e.g. font: 14px/28px “宋体”;

• 当属性需要设置加粗和斜体时，两个属性值只能写在最前面，两个值之间可以互换位置，后面的字号、行高、字体不能更改位置

       - e.g. font: italic bold 14px/28px “宋体”;