/* 颜色属性 color */
color: red; /* 红色 */
color: #fff; /* 白色 */
color: rgb(255, 0, 0); /* 红色 */
color: rgba(255, 0, 0, 0.5); /* 半透明红色 */
/* 背景颜色属性 background-color */
background-color: red; /* 红色 */
background-color: #fff; /* 白色 */
background-color: rgb(255, 0, 0); /* 红色 */
background-color: rgba(255, 0, 0, 0.5); /* 半透明红色 */
background-color: transparent; /* 透明，即不设置背景色 */
/* 边框属性 border */
border: 1px solid red; /* 红色实线边框 */
border: 2px dotted green; /* 绿色虚线边框 */
border: 3px dashed blue; /* 蓝色虚线边框 */
border: none; /* 不显示边框 */
/* 字体属性 font */
font: italic bold 14px Arial, sans-serif; /* 使用Arial字体，粗体斜体，字号14px，sans-serif作为备选字体 */
font-family: Arial, sans-serif; /* 只设置字体类型 */
/* 宽度属性 width */
width: 100px; /* 宽度为100像素 */
width: 80%; /* 宽度为父元素宽度的80% */
/* 高度属性 height */
height: 100px; /* 高度为100像素 */
height: auto; /* 高度自适应内容，在文字排列时使用 */
/* 长度单位 */
长度单位有像素(px)、百分比(%)、em和rem等，其中em和rem单位是相对长度单位，em基于元素的字体大小，rem基于根元素(html)字体大小，使用它们可以做到响应式字体大小设置。
/* 背景图片属性 background-image */
background-image: url("example.jpg"); /* 使用example.jpg作为背景图片 */
background-image: none; /* 不设置背景图片 */上述属性是CSS中经常用到的属性，如果大家能够熟练掌握它们的取值范围和意义，就能够更加灵活地运用CSS来构建页面。