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. MVC+EF 随笔小计————Html Helpers

    理论基础 -- Html Helpers 主要分成输入类和显示类. 输入类: TextArea, TextBox Password Hidden DropDownList ListBox (与Drop ...

  2. 【BZOJ】1051: [HAOI2006]受欢迎的牛

    [HAOI2006]受欢迎的牛 Description 每一头牛的愿望就是变成一头最受欢迎的牛.现在有N头牛,给你M对整数(A,B),表示牛A认为牛B受欢迎. 这种关系是具有传递性的,如果A认为B受欢 ...

  3. 树莓派 raspberry 入门之安装操作系统以及配置

    最近新入手一树莓派,型号是2代B,屏幕是微雪的7 inch c型 显示屏.下面来教大家怎么点亮树莓派. 第一步,装好显示器,显示器的电源接在树莓派的usb口上,HDMI口不多说,连上.然后装好鼠标.键 ...

  4. Hadoop 2.4.0完全分布式平台搭建、配置、安装

    一:系统安装与配置 Hadoop选择下载2.4.0 http://hadoop.apache.org / http://mirror.bit.edu.cn/apache/hadoop/common/h ...

  5. 基于协同过滤的个性化Web推荐

    下面这是论文笔记,其实主要是摘抄,这片博士论文很有逻辑性,层层深入,所以笔者保留的比较多. 看到第二章,我发现其实这片文章对我来说更多是科普,科普吧…… 一.论文来源 Personalized Web ...

  6. 浅谈HTTP响应拆分攻击

    在本文中,我们将探讨何谓HTTP响应拆分以及攻击行为是怎样进行的.一旦彻底理解了其发生原理(该原理往往被人所误解),我们就可以探究如何利用响应拆分执行跨站点脚本(简称XSS).接下来自然就是讨论如果目 ...

  7. 解决“重新安装vmware-tools”灰色而无法安装的问题

    前几天重装系统,之后虚拟机需要重新装,装好后要使用vmware-tools实现文件共享,却发现虚拟机那里显示为灰色的,无法安装vmware-tools,在共享文件夹那里设置好共享的文件夹猴也没有用,/ ...

  8. RecyclerView一个奇怪的npe异常

    java.lang.NullPointerException at android.support.v7.widget.RecyclerView.computeVerticalScrollOffset ...

  9. Android 开发绕不过的坑:你的 Bitmap 究竟占多大内存?

    0.写在前面 本文涉及到屏幕密度的讨论,这里先要搞清楚 DisplayMetrics 的两个变量,摘录官方文档的解释: density:The logical density of the displ ...

  10. uva 11646 - Athletics Track

    题意:如图,体育场的跑道一圈是400米,其中弯道是两段半径相同的圆弧.已知矩形的长宽比例为a:b,求长和宽的具体数值. 注意:圆弧的圆心在纵轴线上! #include<iostream> ...