<!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <title></title>

     <link rel="stylesheet" type="text/css" href="style.css">

     <style type="text/css">

         #p1{font-size: 50px}

         #p2{font-size: 200%}

         #p3{font-size: 2em}

         #p4{font-size: xx-small;}

         #p5{font-size: x-small;}

         #p6{font-size: small;}

         #p7{font-size: medium;}

         #p8{font-size: large;}

         #p9{font-size: x-large;}

         #p10{font-size: xx-large;}

         #p11{font-size: smaller;}

         #p12{font-size: larger;}

         #p13{font-variant: normal; }

         #p14{font-variant: small-caps; }

         #p15{font-style: normal;}

         #p16{font-style: italic;}

         #p17{font-style: oblique;}

         #p18{font-weight: normal;}

         #p19{font-weight: bold;}

         #p20{font-weight: bolder;}

         #p21{font-weight: lighter;}

         #p22{font-weight: 700;}

         #p23{font-weight: 900;}

         #p24{font-family: 隶书,楷体}

         #p25{font: 30px 隶书 }

     </style><!--font-family可设置多个内容，用逗号隔开，若无第一个则匹配第二个以此类推。-->

 </head>

 <body>

     <div>

         <p>未设置字体</p>

         <p id="p1">font-size规定文本的字体尺寸</p>

         <p id="p2">font-size规定文本的字体尺寸</p>

         <p id="p3">font-size规定文本的字体尺寸</p>

         <p id="p4">font-size规定文本的字体尺寸</p>

         <p id="p5">font-size规定文本的字体尺寸</p>

         <p id="p6">font-size规定文本的字体尺寸</p>

         <p id="p7">font-size规定文本的字体尺寸</p>

         <p id="p8">font-size规定文本的字体尺寸</p>

         <p id="p9">font-size规定文本的字体尺寸</p>

         <p id="p10">font-size规定文本的字体尺寸</p>

         <p id="p11">font-size规定文本的字体尺寸</p>

         <p id="p12">font-size规定文本的字体尺寸</p>

         <p id="p13">font-variant规定是否以小型大写字母的字体显示文本,normal默认值，浏览器会显示一个标准字体</p>

         <p id="p14">font-variant规定是否以小型大写字母的字体显示文本，浏览器会显示小型大写字母的字体</p>

         <p id="p15">font-style规定文本的字体样式，normal默认值，浏览器会显示一个标准字体</p>

         <p id="p16">font-style规定文本的字体样式，italic浏览器会显示一个斜体的字体样式，类似i标签的作用</p>

         <p id="p17">font-style规定文本的字体样式，oblique浏览器会显示一个倾斜的字体样式</p>

         <p id="p18">font-weight规定字体的粗细，normal默认值，标准粗细。类似b标签的作用</p>

         <p id="p19">font-weight规定字体的粗细，bold粗体</p>

         <p id="p20">font-weight规定字体的粗细，bolder更粗</p>

         <p id="p21">font-weight规定字体的粗细，lighter更细</p>

         <p id="p22">font-weight规定字体的粗细，100-900,400等同normal，700等同bold</p>

         <p id="p23">font-weight规定字体的粗细，100-900,400等同normal，700等同bold</p>

         <p id="p24">font-family规定字体系列，如楷体、隶书等</p>

         <p id="p25">font可同时设置字体多种属性，至少要设置字体大小font-size(位置倒数第二）和字体系统font-family(位置最后），font-style、font-variant、font-weight放在前面顺序随便。</p>

         <p id="p26">font-face我的自定义字体</p>

     </div>

 </body>

 </html>
 @font-face{

     font-family: "myfont";

     src:url('fonts/FZMWFont.ttf');

 }

 #p26{font-size:40px;font-family: myfont}

【CSS3】字体font的更多相关文章

  1. CSS Sprites+CSS3 Icon Font

    CSS Sprites+CSS3 Icon Font CSS Sprites在国内很多人叫CSS精灵,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来, ...

  2. CSS3 字体

    CSS3 @font-face 规则 在 CSS3 之前,web 设计师必须使用已在用户计算机上安装好的字体. 通过 CSS3,web 设计师可以使用他们喜欢的任意字体. 当您您找到或购买到希望使用的 ...

  3. W3School-CSS 字体(font)实例

    CSS 字体(font)实例 CSS 实例 CSS 背景实例 CSS 文本实例 CSS 字体(font)实例 CSS 边框(border)实例 CSS 外边距 (margin) 实例 CSS 内边距 ...

  4. CSS3文字描边 CSS3字体外部描边

    给需要实现文字描边的元素添加如下CSS3的属性 text-shadow:#000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0; -webkit-t ...

  5. Android Studio 3.1.2 修改字体(font)大小(size) 及老版本修改主题、字体、颜色 参照地址

    Android Studio 3.1.2  修改字体(font)大小(size) 步骤:File-Settings-Editor-Color Scheme-Color Scheme Font-Size ...

  6. CSS 字体(font)实例

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

  7. 收集的可以下载css3字体图标的网站

    http://icomoon.io/app/ 可以选择跟简单调整图标打包成css3 字体下载, http://www.flaticon.com/categories/weapons

  8. css3 字体、2D转换、3D转换

    学习篇之CSS3 字体.2D转换.3D转换 一.字体 @font-face 将字体文件存放到 web 服务器上,通过CSS3 @font-face规则中定义,它会在需要时被自动下载到用户的计算机上. ...

  9. CSS3使用Font Awesome字体图标的控件样例（按钮，工具栏，输入框）

    按钮上加入font awesome图标,用原生的input button标签无法实现,查看网上的只能通过<a><li></li></a>实现此功能,通过 ...

随机推荐

  1. 有序GUID

    背景 常见的一种数据库设计是使用连续的整数为做主键,当新的数据插入到数据库时,由数据库自动生成.但这种设计不一定适合所有场景. 随着越来越多的使用Nhibernate.EntityFramework等 ...

  2. AIO5打印样式函数说明

    函数名称 描述 _RM_Column 返回当前栏目数. _RM_Line 返回数据行数(从分组的起始位置开始) _RM_LineThough 返回数据行数(从报表的起始位置开始) _RM_Page 返 ...

  3. （11.28）Java小知识！

    关于继承的继承机制:继承中最常使用的两个关键字是exteds和implements.今天主要和大家分享extends的知识点.这两个关键字的使用决定了一个对象和另一个对象是否是IS-A关系.同时我们还 ...

  4. LINQ学习系列-----2.2 迭代器

    在学习本篇迭代器之前,强烈建议可以先学习一位具有工匠精神博主的文章,链接如下: 农码一生---先说IEnumerable,我们每天用的foreach你真的懂它吗? 本篇文章,是在该博主博文的基础上再次 ...

  5. C语言的scanf函数

    一. 变量的内存分析 1. 字节和地址 1> 内存以“字节为单位”,Oxffc1,Oxffc2,Oxffc3,Oxffc4....都是字节 ,0x表示的是十六进制 2> 不同类型占用的字节 ...

  6. 02-线性结构3 Reversing Linked List

    题目 Sample Input: 00100 6 4 00000 4 99999 00100 1 12309 68237 6 -1 33218 3 00000 99999 5 68237 12309 ...

  7. SaltStack 安装介绍 01

    一.入门指南 1.1 SALTSTACK是什么? The backbone of Salt is the remote execution engine, which creates a high-s ...

  8. leecode -- 3sum Closet

    Given an array S of n integers, find three integers in S such that the sum is closest to a given num ...

  9. cinder块存储 后端采用lvm、nfs安装配置

    #cinder块存储 后端采用lvm.nfs安装配置 openstack pike 安装 目录汇总 http://www.cnblogs.com/elvi/p/7613861.html #cinder ...

  10. Prim算法模板

    //Gang #include<iostream> #include<cstring> #include<algorithm> #include<cstdio ...