【CSS3】Advanced5:At Rules:@import, @media, and @font-face
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的更多相关文章
- 【CSS3】Advanced3:Universal, Child, and Adjacent Selectors
1.Universal selectors eg:#target*{ } 2.Child selectors < something immediately nested within some ...
- 【HTML】Advanced5:Accessible Forms
1.label <form> <label for="yourName">Your Name</label> <input name=&q ...
- 【CSS3】Advanced11:Media Queries
1.Browser-size specific CSS @media screen and (max/min-width:1000px){} 2.Orientation-specific CSS? @ ...
- 【CSS3】Advanced10:Gradient
1.background:linear-gradient(20deg/(to) bottom right,orange,red,hsl(60,100%,50%)); 2.-webkit-chrome/ ...
- 【CSS3】Advanced9:Transformation
1.transform:rotate(-10deg) skew(20deg,10deg) scaling(2/1,2) translate/移动(100px,200px) 2.transform:ma ...
- 【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 ...
- 【CSS3】Advanced7:CSS Transitions
1.animate parts of your design without the need for the likes of JavaScrip 2.allowing smooth animati ...
- 【CSS3】Advanced6:Attribute Selectors
1.with the attribute abbr[title]{color:red} 2.with the attribute and it's value input[type=text][dis ...
- 【CSS3】Advanced4:Advanced Colors
1.rgba(red,green,blue,alpha(不透明度0.0(完全透明)与 1.0(完全不透明)) 2.HSLa(hue(色调 0red 120green 240blue),saturati ...
随机推荐
- ECSHOP模板设置,前台英文后台中文,无需复制
很多做英文站的朋友 只想让前台显示为英文,后台依就保持中文.这个要如何来做呢?网上也看到类似文章,好像还要进行目录复制与覆盖.我下面这个方法更简单,无需复制. 第一步: 通过后台设置实现前台英文.进入 ...
- Pjax介绍及在asp.net MVC3中使用pjax的简单示例
相信很多人对ajax并不陌生,对ajax的一些优点也了如指掌,如:局部刷新改善用户体验,减少开销,让服务器和浏览器之间的响应更快等. 但是它的缺点也是很显而易见的: AJAX大量的使用了javascr ...
- nls_sort和nlssort 排序功能介绍
nls_sort和nlssort 排序功能介绍 博客分类: oracle ALTER SESSION SET NLS_SORT=''; 排序影响整个会话 Oracle9i之前,中文是按照二进制编码 ...
- android开发两种退出程序方式(killProcess,System.exit)
KillProcess: 在android中我们如果想要程序的进程结束可以这样写: android.os.Process.killProcess(android.os.Process.myPid()) ...
- C# - ref & out
引用参数和值参数 值参数,是在函数中此变量的任何修改都不影响函数调用中指定的参数,除非把它当作返回值返回,经典例子,交换两个数,但是返回值只有一个. 此时可以用引用参数,函数处理的变量和函数调用中使用 ...
- 利用Multipeer Connectivity框架进行WiFi传输-b
什么是Multipeer Connectivity? 在iOS7中,引入了一个全新的框架——Multipeer Connectivity(多点连接).利用Multipeer Connectivity框 ...
- HDU 1560 DNA sequence (IDA* 迭代加深 搜索)
题目地址:http://acm.hdu.edu.cn/showproblem.php?pid=1560 BFS题解:http://www.cnblogs.com/crazyapple/p/321810 ...
- python mongodb 读写CSV文件
# -*- coding: utf-8 -*-import osimport csvimport pymongofrom pymongo import MongoClient #建立连接client ...
- 【产品体验】eyepetizer开眼
第一次写博客,内心还有点小激动呢~~本人产品新人,学习中,希望大家多多指教! 先来两张开眼的界面图坐镇—— 开眼简介: appetizer for eyes 即 eyepetizer ...
- hex(x) 将整数x转换为16进制字符串
>>> a = 122 >>> b = 344 >>> c = hex(a) >>> d = hex(b) >>&g ...