CSS（零）-预热篇

最新推荐文章于 2021-12-14 13:57:47 发布

fullstack_lth

最新推荐文章于 2021-12-14 13:57:47 发布

阅读量530

点赞数 1

分类专栏： CSS web 文章标签： CSS

本文链接：https://blog.csdn.net/u014744118/article/details/98873684

版权

本文是对CSS基础知识的全面梳理，包括预热篇、选择器、属性和值，涵盖@规则、选择器语法、伪类和伪元素、CSS变量以及一些常用的图形绘制和布局函数。通过学习，旨在巩固和提升CSS技能。

摘要由CSDN通过智能技术生成

这是一个系列的文章，你也可以查看其他文章：

最近听了winter的极客时间专栏关于css的讲解，深感自己的css基础较为薄弱，所以打算最近将css的重要东西做一个总结。

首先学习css需要到W3C的网站，在这里会发现有很多css相关标准，去掉Working Draft状态的标准，切换标准状态下拉框，得到候选标准为13，候选标准为23,（数据一直在变化，截止20190808数据）。

css语法的最新标准为：https://www.w3.org/TR/css-syntax-3/在这里你能找到关于css的最新语法标准。这篇文档比较详细，包含css的简介、描述、标记和解析css，以及css的分类。

从文档我们知道css语法规则分为两类：一是带@的规则（at-rule），二是普通规则(qualified rule)。

一、at-rule

由@关键字和后续的一个区块组成，如果没有区块，则以；结束。实际开发中使用较少。

@charset 字符编码规则

@charset "utf-8";

@import 引入一个css文件

@import [ <url> | <string> ]
        [ supports( [ <supports-condition> | <declaration> ] ) ]?
        <media-query-list>? ;

@media 媒体查询对设备类型判断

@media print {
    body { font-size: 10pt }
}

@page 分页媒体访问网页的表现

@page {
  size: 8.5in 11in;
  margin: 10%;

  @top-left {
    content: "Hamlet";
  }
  @top-right {
    content: "Page " counter(page);
  }
}

@counter-style 定义列表项表现，出firefox部分支持外，其他浏览器都不支持。可以上 https://c

关注