美化盒子

第一部分

字体大小【font-size】

含义：字符框的高度、可继承、默认值：medium

取值：medium：中等字号、larger：大字号、smaller：小字号

加粗字体【font-weight】

将【font-weight】设置为【bold】，以加粗文字，该属性可继承

倾斜字体【font-style】

将【font-style】设置为【italic】，以倾斜文字，该属性可继承

字间距【letter-spacing】

设置【letter-spacing】的值为px或em，可控制文字间的间隙，该属性可继承

首行缩进【text-indent】

可实现第一个文字向后缩进

给文字划线【text-decoration】

设置【text-decoration】属性，可以给文字划线

 

第二部分

修饰首字母【伪元素选择器 ::first-letter】

【::first-letter】可选中元素中的第一个文字

修饰首行【伪元素选择器 ::first-line】

  【::first-line】可选中元素中的第一行文字

修饰选中文字【伪元素选择器 ::selection】

  【::selection】可选中被用户框选的文字

字体类型：概念：衬线字体和非衬线字体

  修改字体类型【font-family】

  使用【@font-face指令】加载web字体

  使用图标字体

 

美化边框

圆角边框【border-radius】

美化背景

使用【background-image】设置背景图片

使用【background-repeat】设置图片重复方式

  repeat：【默认值】从左到右从上到下重复

  no-repeat：不重复

  repeat-x：仅在x轴方向上重复

repeat-y：仅在y轴方向上重复

使用【background-position】设置图片在边框盒中的位置

  预设值：left、right、top、bottom、center

  数值：使用数值可实现从雪碧图（Sprite）中取得部分图像

使用【background-size】设置背景图尺寸

使用【background-attachment】固定背景图

  scroll：【默认值】背景图跟随元素移动

  fixed：背景图固定

使用速写属性【background】统一设置

background：背景图 位置 / 尺寸 重复方式 固定方式 背景颜色

背景渐变：线性渐变：【background-image：linear-gradient(...)】

径向渐变（圆形渐变）：【background-image：radial-gradient(...)】

透明度和鼠标样式

透明度【opacity】和alpha通道

阴影

文字阴影【text-shadow】

盒子阴影【box-shadow】