CSS 实例

在本章中，我们将通过一些实际的 CSS 示例来帮助你更好地理解和掌握 CSS 的基本概念和用法。以下是一些常见的 CSS 实例：

1. 设置文本样式

// www.javascriptcn.com code example
/* 设置文本颜色为红色 */
p {
  color: red;
}

/* 设置文本居中对齐 */
h1 {
  text-align: center;
}

/* 设置文本字体为 Arial */
body {
  font-family: Arial, sans-serif;
}

2. 设置背景样式

// www.javascriptcn.com code example
/* 设置背景颜色为浅灰色 */
body {
  background-color: #f0f0f0;
}

/* 设置背景图片 */
div {
  background-image: url('background.jpg');
  background-size: cover;
}

3. 设置盒模型样式

// www.javascriptcn.com code example
/* 设置元素边框为实线，颜色为黑色 */
div {
  border: 1px solid black;
}

/* 设置元素内边距 */
p {
  padding: 10px;
}

/* 设置元素外边距 */
h1 {
  margin: 20px;
}

以上是一些简单的 CSS 实例，希望能帮助你更好地理解 CSS 的基本用法。在接下来的章节中，我们将深入探讨更多的 CSS 主题，包括布局、动画、响应式设计等。