1.@import

bolt another stylesheet onto your existing one.

@import url(**.css);

must be placed at the top of a stylesheet, before any other rules.

2.@media

screen, print, projection, handheld, and all, or a comma-separated list of more than one,variables relating to that media

eg:@media screen,projection

3.@font-face

eg1:@font-face{

font-family:"font of all knowledge";

src:url(fontofallknowledge.woff");

}

create a font named “font of all knowledge” using the font-family descriptor and links the font file “fontofallknowledge.woff” to that name using the src descriptor. “font of all knowledge” can then be used in a standard font rule

The font will be downloaded (in this case from the same directory as the CSS file) and applied to paragraphs

eg2:Checking to see if a font is already present on a user’s computer,removing the need to download it,specify which one you’re interested in.

Could use Google Web Fonts


@font-face {
font-family: "font of all knowledge";
src: local("font of all knowledge"), local(fontofallknowledge), url(fontofallknowledge.woff);
font-weight: 400;
font-style: normal;
}


【CSS3】Advanced5:At Rules:@import, @media, and @font-face的更多相关文章

  1. 【CSS3】Advanced3:Universal, Child, and Adjacent Selectors

    1.Universal selectors eg:#target*{ } 2.Child selectors < something immediately nested within some ...

  2. 【HTML】Advanced5:Accessible Forms

    1.label <form> <label for="yourName">Your Name</label> <input name=&q ...

  3. 【CSS3】Advanced11:Media Queries

    1.Browser-size specific CSS @media screen and (max/min-width:1000px){} 2.Orientation-specific CSS? @ ...

  4. 【CSS3】Advanced10:Gradient

    1.background:linear-gradient(20deg/(to) bottom right,orange,red,hsl(60,100%,50%)); 2.-webkit-chrome/ ...

  5. 【CSS3】Advanced9:Transformation

    1.transform:rotate(-10deg) skew(20deg,10deg) scaling(2/1,2) translate/移动(100px,200px) 2.transform:ma ...

  6. 【CSS3】Advanced8:CSS Backgrounds: Multiples, Size, and Origin

    1.Multiples,Size,and Origin eg:background-image:url(bg.png),url(bullet.png) 0 50% no-repeat,url(arro ...

  7. 【CSS3】Advanced7:CSS Transitions

    1.animate parts of your design without the need for the likes of JavaScrip 2.allowing smooth animati ...

  8. 【CSS3】Advanced6:Attribute Selectors

    1.with the attribute abbr[title]{color:red} 2.with the attribute and it's value input[type=text][dis ...

  9. 【CSS3】Advanced4:Advanced Colors

    1.rgba(red,green,blue,alpha(不透明度0.0(完全透明)与 1.0(完全不透明)) 2.HSLa(hue(色调 0red 120green 240blue),saturati ...

随机推荐

  1. ECSHOP模板设置,前台英文后台中文,无需复制

    很多做英文站的朋友 只想让前台显示为英文,后台依就保持中文.这个要如何来做呢?网上也看到类似文章,好像还要进行目录复制与覆盖.我下面这个方法更简单,无需复制. 第一步: 通过后台设置实现前台英文.进入 ...

  2. Pjax介绍及在asp.net MVC3中使用pjax的简单示例

    相信很多人对ajax并不陌生,对ajax的一些优点也了如指掌,如:局部刷新改善用户体验,减少开销,让服务器和浏览器之间的响应更快等. 但是它的缺点也是很显而易见的: AJAX大量的使用了javascr ...

  3. nls_sort和nlssort 排序功能介绍

    nls_sort和nlssort 排序功能介绍 博客分类: oracle   ALTER SESSION SET NLS_SORT=''; 排序影响整个会话 Oracle9i之前,中文是按照二进制编码 ...

  4. android开发两种退出程序方式(killProcess,System.exit)

    KillProcess: 在android中我们如果想要程序的进程结束可以这样写: android.os.Process.killProcess(android.os.Process.myPid()) ...

  5. C# - ref & out

    引用参数和值参数 值参数,是在函数中此变量的任何修改都不影响函数调用中指定的参数,除非把它当作返回值返回,经典例子,交换两个数,但是返回值只有一个. 此时可以用引用参数,函数处理的变量和函数调用中使用 ...

  6. 利用Multipeer Connectivity框架进行WiFi传输-b

    什么是Multipeer Connectivity? 在iOS7中,引入了一个全新的框架——Multipeer Connectivity(多点连接).利用Multipeer Connectivity框 ...

  7. HDU 1560 DNA sequence (IDA* 迭代加深 搜索)

    题目地址:http://acm.hdu.edu.cn/showproblem.php?pid=1560 BFS题解:http://www.cnblogs.com/crazyapple/p/321810 ...

  8. python mongodb 读写CSV文件

    # -*- coding: utf-8 -*-import osimport csvimport pymongofrom pymongo import MongoClient #建立连接client ...

  9. 【产品体验】eyepetizer开眼

    第一次写博客,内心还有点小激动呢~~本人产品新人,学习中,希望大家多多指教!  先来两张开眼的界面图坐镇——         开眼简介: appetizer for eyes 即 eyepetizer ...

  10. hex(x) 将整数x转换为16进制字符串

    >>> a = 122 >>> b = 344 >>> c = hex(a) >>> d = hex(b) >>&g ...