CSS 教程

CSS(层叠样式表)是一种用于描述HTML或XML文档样式的样式表语言。它允许你将文档内容和文档的外观(样式)分离,使得你可以轻松地更改网页的样式而不需要修改HTML结构。

基础语法

CSS的基本语法由选择器和声明块组成。以下是一个简单的CSS示例:

body {
  background-color: #f0f0f0;
  font-family: Arial, sans-serif;
}

这里,body 是选择器,它指定了样式将应用于HTML文档的 <body> 元素。大括号 {} 内的声明块包含了具体的样式规则。

选择器

CSS选择器用于指定要应用样式的HTML元素。以下是一些常用的选择器:

  • 元素选择器<标签名>,例如 p 选择所有 <p> 元素。
  • 类选择器.类名,例如 .highlight 选择所有具有 highlight 类的元素。
  • ID选择器#id名,例如 #title 选择具有 title ID的元素。

属性

CSS属性用于定义元素的样式。以下是一些常用的CSS属性:

  • 颜色color,例如 color: red; 设置文本颜色。
  • 背景色background-color,例如 background-color: #fff; 设置背景颜色。
  • 字体font-family,例如 font-family: '微软雅黑', sans-serif; 设置字体。

实例

以下是一个简单的HTML和CSS示例:

<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <title>我的网页</title>
  <style>
    body {
      background-color: #f0f0f0;
      font-family: Arial, sans-serif;
    }
    .highlight {
      color: red;
      font-weight: bold;
    }
  </style>
</head>
<body>
  <h1 id="title">欢迎来到我的网页</h1>
  <p class="highlight">这是一个示例段落。</p>
</body>
</html>

在这个例子中,我们设置了一个标题和段落的样式。

更多信息

想要了解更多关于CSS的信息,请访问我们的CSS教程页面。

[center]https://cloud-image.ullrai.com/q/css/[/center]