码迷,mamicode.com
首页 > Web开发 > 详细

CSS-@规则

时间:2019-01-27 21:50:26      阅读:173      评论:0      收藏:0      [点我收藏+]

标签:local   lan   int   fine   char   dia   phone   双引号   efi   

@规则

@charset — Defines the character set used by the style sheet.

@import — Tells the CSS engine to include an external style sheet.

@namespace — Tells the CSS engine that all its content must be considered prefixed with an XML namespace.

嵌套 @规则

@media— 满足媒体查询条件则里面的 CSS 生效。例如:Bootstrap 使用下面的范围作为条件

/* https://getbootstrap.com/docs/4.2/layout/overview/#responsive-breakpoints */

// Extra small devices (portrait phones, less than 576px)
// No media query for `xs` since this is the default in Bootstrap

// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }

@funt-face— 可以给文本指定的自定义字体。例如:antd 用她指定中文的单双引号的字体

/* 
https://github.com/ant-design/ant-design/blob/3.12.1/components/style/core/base.less 
指定中文的单双引号的字体
*/

@font-face {
  font-family: "Chinese Quote";
  src: local("PingFang SC"), local("SimSun");
  unicode-range: U+2018, U+2019, U+201c, U+201d;
}

等。。

参考

@规则 | MDN

CSS-@规则

标签:local   lan   int   fine   char   dia   phone   双引号   efi   

原文地址:https://www.cnblogs.com/jffun-blog/p/10327319.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!