CSS（层叠样式表）是用于描述HTML或XML文档样式的样式表语言。它用于设置网页元素的布局、颜色、字体等样式。以下是CSS的一些基本概念和教程。

CSS 基础

  • 选择器：用于选择HTML元素。

    • 元素选择器：p 选择所有 <p> 元素。
    • 类选择器：.class 选择所有具有特定类的元素。
    • ID选择器：#id 选择具有特定ID的元素。

  • 属性：用于设置元素的样式。

    • color：设置文本颜色。
    • font-size：设置字体大小。
    • margin：设置外边距。

  • 值：指定属性的值。

    • red：颜色值。
    • 12px：字体大小值。

CSS 选择器

CSS选择器用于定位HTML元素，以便可以应用特定的样式。以下是一些常用的选择器：

  • 元素选择器：直接使用HTML标签名作为选择器。

    p {
  color: blue;
}

  • 类选择器：使用.开头，后面跟着类名。

    .my-class {
  font-size: 14px;
}

  • ID选择器：使用#开头，后面跟着ID名。

    #my-id {
  margin: 10px;
}

CSS 布局

CSS布局用于控制网页元素的排列和定位。以下是一些常用的布局技术：

  • 浮动布局：使用float属性实现。

    .float-container {
  float: left;
  width: 30%;
}

  • Flexbox布局：使用display: flex;实现。

    .flex-container {
  display: flex;
}

  • Grid布局：使用display: grid;实现。

    .grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

更多内容

想要了解更多关于CSS的信息，请访问我们的 CSS 完全指南。