理解CSS

什么是 CSS?

CSS是一种用于向用户指定文档如何呈现的语言 — 它们如何被指定样式、布局等。

CSS如何影响HTML？

Web浏览器将CSS规则应用于文档以影响它们的显示方式。一个CSS规则由以下组成：

• 一组 属性 ，属性的值更新了 HTML 的内容的显示方式。比如，我想让元素的宽度是其父元素的50％，或者元素背景变为红色。
• 一个 选择器，它选择元素，这（些）元素是你想应用这些最新的属性值于其上的元素。比如，我想将我的CSS规则应用到我HTML文档中的所有段落上。

样式表中的一组CSS规则确定了网页如何显示，你将在下一篇文章中了解更多关于CSS语法的内容 — CSS 语法。

CSS 实际上如何工作？

当浏览器显示文档时，它必须将文档的内容与其样式信息结合。它分两个阶段处理文档：

1. 浏览器将 HTML 和 CSS 转化成 DOM （文档对象模型）。DOM在计算机内存中表示文档。它把文档内容和其样式结合在一起。
2. 浏览器显示 DOM 的内容。

如何将你的 CSS 应用到你的 HTML 上

外部样式表

<link rel="stylesheet" href="style.css">

内部样式表

<style>
      h1 {
        color: blue;
        background-color: yellow;
        border: 1px solid black;
      }

      p {
        color: red;
      }
    </style>

内联样式

<h1 style="color: blue;background-color: yellow;border: 1px solid black;">Hello World!</h1>

引用自：https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Introduction_to_CSS/How_CSS_works