通用字体系列

CSS中定义了5种通用字体系列

举例说明:指定通用字体系列

        body {
font-family:sans-serif;/*如果你希望文档使用一种sans-serif字体而并不关心是哪一种具体字体,这样用户代理会从ans-serif字体系列中选择一个字体将其应用到body元素上*/
}
        h1 {
font-family: Georgia,serif; /*如果Georgia字体不可用,则使用另外一种serif字体*/
} h2 {
font-family: Times,'Times New Roman',Georgia,serif;/*按先后顺序来、最后指定一个通用字体名以保险起见*/
/*只有当一个字名中有一个或多个空格或者如果字体名包括#或$之类的符号,才需要在font-family声明中加引号*/
}

font-weight字体加粗中是如何起作用的?

字体指定了9级加粗度,即100~900,其中400定义为等价于normal,700对应于bold,其它数不对应font-weight的任何其它值,不过它们可能对应于常用变形名。规则如下

举例说明一下:

字体的风格和变形

font-style的值可以为:italic、oblique、normal、inherit

normal:非斜体和倾斜的字体

oblique:正常竖直文本的一个倾斜版本

italic:斜体是一种单独的字体风格,对每个字母的结构有一些小改动,来反映变化的外观

css字体相关的零碎点点

        p {
font-variant:small-caps;/*小型大写字母*/
font-stretch:wider;/*这个属性用于让一个字体的字符更胖或更瘦*/
font-size-adjust:0.58;/*让字体保证可以辨识*/
}

font属性

font的前三个值font-style、font-weight和font-variant,后两个值为font-size和font-family,其中前三个值允许采用任意的顺序或者说可以任意省略,后两个值则必须font-size在前,font-family在后作为声明中的最后两个值,而且font声明中必须要有这两个值。

另外值得一提的是在font属性中可以增加行高,如下所示

再来看一个例子:

上述的css事实上跟下面的css是等价的

因为被忽略的值都会重置为其默认值 ,因为也将导致其覆盖inherit属性,所以使用font缩写属性时还是应该小心一些才好。

使用系统字体

        div {
font: caption;/*标题的控件*/
font: icon;/*图标加标签*/
font: menu;/*菜单*/
font: message-box;/*对话框*/
font: small-caps;/*小控件加标签*/
font: status-bar;/*窗口状态条*/
}

CSS--字体的更多相关文章

  1. CSS字体属性大全

    文章转自:http://www.10wy.net/Article/CSS/CSS_list_8.html查看更多更专业性的文章请到:网页设计网 CSS字体属性 字体名称属性(font-family) ...

  2. css字体样式(Font Style),属性

    css字体样式(Font Style),属性   css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者 ...

  3. Css字体中英文对照表

    css字体中文.英文.Unicode名对照表 另外注意:繁体中文字体名,在简体中文系统中是不能被识别的. 中文名 英文名 Unicode Unicode 2 Mac OS 华文细黑 STHeiti L ...

  4. css字体设置

    css字体设置 .selector{ font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,S ...

  5. 2.css字体单位

    这期简单说说css字体单位 字体单位有三种:px.em.rem 任意浏览器的默认字体高都是16px.所有未经调整的浏览器都符合: 1em=16px. % 百分比 in 英寸 cm 厘米 mm 毫米 e ...

  6. Css - 字体图标

    Css - 字体图标 字体格式 ttf.otf.woff.svg.eot 现在流行将图标做成矢量的字体格式的文档,很多用户在放大页面的时候页面上的普通图片格式的图标就会变得模糊不清,这种字体图标在网页 ...

  7. CSS 字体(font)实例

    CSS 字体(font)实例CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母).CSS 字体系列在 CSS 中,有两种不同类型的字体系列名称: 通用字体系列 - 拥 ...

  8. css字体中英文对照表(转)

     在css文件中,我们常看到有些字体名称变成了乱码,这是由于网页开发者将中文字体的名字直接写成了中文,而css文件本身没有声明字符编码方式,查看时就出现了乱码.为了避免这种乱码状况出现,可以将css文 ...

  9. css 字体样式设置

    css字体样式(Font Style),属性 时间:2014-05-08 21:49 来源:我爱学习网 | 作者:我爱学习网 | 本文已影响 68353 人   css字体样式(Font Style) ...

  10. css字体图标的制作和使用。

    css字体图标的制作和使用. 在项目开发的过程中,我们会经常用到一些图标.但是我们在使用这些图标时,往往会遇到失真的情况,而且图片数量很多的话,页面加载就越慢.所以,我们可以使用字体图标的方式来显示图 ...

随机推荐

  1. Angular指令1

    Angular的指令 也就是directive,其实就是一WebComponent,以前端的眼光来看,好象很复杂,但是以后端的眼光来看,还是非常简单的.其实就是一个中等水平的类. var myModu ...

  2. Hadoop2.6.0伪分布环境搭建

    用到的软件: 一.安装jdk: 1.要安装的jdk,我把它拷在了共享文件夹里面.   (用优盘拷也可以) 2.我把jdk拷在了用户文件夹下面. (其他地方也可以,不过路径要相应改变) 3.执行复制安装 ...

  3. Oracle sql develpoer

    Oracle SQL Developer是针对Oracle数据库的交互式开发环境(IDE)     Oracle SQL Developer简化了Oracle数据库的开发和管理. SQL Develo ...

  4. 屠龙之路_击败DB小boss_FifthDay

    摘要:服务器大魔王被击败的消息传到了恶龙boss那里,恶龙大怒派出了自己的首级大将DB人称小boss,但小boss的名号并没有吓到七位屠龙勇士,经过他们齐心协力的进攻,最终击败了DB,小boss临死前 ...

  5. Beta版本冲刺———第三天

    会议照片: 项目燃尽图: 1.项目进展: 今天解决的进度:对游戏结束的检测进行了完善,使分数标签和最高分标签的变化更加合理. 仍在进行对排行榜分数变更的实现 2.每个人每天做的事情 郭怡锋:汇总工作进 ...

  6. 1019mysql 复制技术

    -- 第一步实现主从复制参照 http://369369.blog.51cto.com/319630/790921/核心点 :开启二进制日子和服务器ID,创建复制账号,配置连接主从服务器,查看各自状态 ...

  7. mysql 根据某些字段之和排序

    在自己项目中记录了比赛球队获得金银铜牌的具体奖牌数,遇到需求是按照奖牌个数排序 select a.RANK_ID,a.COUNTRY,a.GOLD,a.SILVER,a.BRONZE,a.ICON,a ...

  8. ViewPager导航栏TabLayout

    ViewPager中加入TabLayout导航 需要导入依赖包:  'com.android.support:appcompat-v7:xxxxx' compile 'com.android.supp ...

  9. Java设计模式(一) 策略模式

    策略模式:定义了算法族,分别封装起来,让它们之间可以互相替换,此模式让算法的变化独立于使用算法的客户. 1,定义算法接口 package com.pattern.strategy.test; publ ...

  10. 数据库开发基础-SQl Server 视图

    1.视图的概述            视图其实就是一条查询sql语句,用于显示一个或多个表或其他视图中的相关数据.视图将一个查询的结果作为一个表来使用,因此视图可以被看作是存储的查询或一个虚拟表.视图 ...