📌  相关文章
📜  CSS 介绍(1)

📅  最后修改于: 2023-12-03 15:00:07.716000             🧑  作者: Mango

CSS 介绍

CSS (Cascading Style Sheets) 是一种用于描述网页内容样式的语言。它可以让网页开发者控制网页的布局、字体、颜色、背景等方面的外观，从而达到美化网页的目的。

语法

CSS 的基本语法如下：

选择器 {
    属性1: 值1;
    属性2: 值2;
    ...
}

其中，选择器用于选中要应用样式的元素，属性用于指定要修改的样式属性，值用于指定修改后的属性值。

例如，下面的 CSS 代码会将所有段落的文字颜色设置为红色：

p {
    color: red;
}
选择器

CSS 提供了很多不同种类的选择器，用于选中不同的元素。一些常见的选择器包括：

  • 标签选择器（例如 p、h1、div 等）
  • 类选择器（以 . 开头，例如 .box）
  • ID 选择器（以 # 开头，例如 #header）
  • 属性选择器（例如 [title]、[href^="https://"] 等）
  • 组合选择器（将多个选择器组合在一起，例如 .box p、ul li 等）
属性

CSS 支持很多不同的属性，用于实现不同的样式效果。一些常见的属性包括：

  • color：文字颜色
  • background：背景颜色或背景图片
  • font-size：字体大小
  • padding：内边距
  • margin：外边距
  • border：边框
注释

CSS 支持两种注释方式。单行注释以 /* 开头，以 */ 结尾。多行注释以 // 开头，以换行符结束。

例如：

/* 这是一个单行注释 */

/*
这是一个
多行注释
*/
引入 CSS 文件

可以使用 <link> 标签将一个外部的 CSS 文件引入到 HTML 页面中。例如：

<!DOCTYPE html>
<html>
<head>
    <title>My Page</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <p>Hello, world!</p>
</body>
</html>

在上面的例子中，<link> 标签会引入名为 styles.css 的外部 CSS 文件。