CSS语法总结
CSS中除了我们经常写的那些内容外 还有像@charset @import @namespce @keyframes @media @page @font-face @viewport等。
1, @charset 在外部样式表文件内使用。指定该样式表使用的字符编码。该规则后面的分号是必需的，如果省略了此分号，会生成错误信息。
@charset "utf-8";
html{***}
2，@import 指定导入的外部样式表及目标媒体。
语法：
@import <url> <media_query_list>
<url>：使用绝对或相对地址指定导入的外部样式表文件。可以是url(url)或者直接是一个url
<media_query_list>：指定媒体类型和查询条件。
<media_query_list>：[<media_query>[‘,‘ <media_query>]*]?
<media_query>：[only | not]? <media_type> [and <expression>]* | <expression> [and <expression>]*
<expression>：‘(‘<media_feature>[:<value>]?‘)‘
@import url("global.css");
@import url(global.css);
@import "global.css";
@import url(example.css) screen and (min-width:800px);
@import url(example.css) screen and (width:800px),(color);
@import url(example.css) screen and (min-device-width:500px) and (max-device-width:1024px);
3，@namespce 在CSS中声明一个XML命名空间的前缀。当你使用的选择器仅匹配特定命名空间下的元素，则这东西就很管用。
4，@keyfames 用于设置动画
5，@media 指定样式表规则用于指定的媒体类型和查询条件。
语法：@media：<media_query_list>，可以用于@meida 和@import 以及HTMl中。
@media screen and (width:800px){ … } @import url(example.css) screen and (width:800px); <link media="screen and (width:800px)" rel="stylesheet" href="example.css" />
所有浏览器都适用的媒介类型有：all,screen,print。 handheld适用于chrome safari 以及opera.
6，@page 检索或指定显示对象容器时使用的页面类型
7，@font-face 设置嵌入HTML文档的字体。通常使用.ttf(TrueType)和.otf(OpenType)两种字体格式。
语法：
@font-face{font-family:name;src:<url>;sRules;}
<name>：字体名称
<url>：使用绝对或相对地址指定OpenType字体
<sRules>：样式表定义。包括（font-style：设置文本样式。
font-variant：设置文本是否大小写。
font-weight：设置文本的粗细。
font-stretch：设置文本是否横向的拉伸变形。
font-size：设置文本字体大小。）
@font-face{ font-family:YH; src:url(http://domain/fonts/MSYH.TTF); } //media query将viewport小于400px缩放至320px宽。
8，@viewport 需要加前缀
@media screen and (max-width: 400px) { @-ms-viewport { width: 320px; } ... }
9,!important用于提升指定样式规则的应用优先权，在IE6以及以前的浏览器不支持。
.classes{
color:#f00!important;
color:#ff0;
} 表现为红色，而非黄色。但是在IE6中表现为黄色。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
