<!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. 源码怎么找之rest_framework的用户认证

    首先得有一点常识,比如用户认证,就是authenticate 比如一个函数,应该有返回值, 比如一个类里面的self,真的是代表本身这个类吗 再比如看到一个东西加括号,就两种情况,一种是函数,一种是类 ...

  2. python3学习笔记（1）

    一.模块初识(接上篇)模块(库)分为两种:1.标准库:不需要安装直接可以导入的库,例:getpass.2.第三方库:必须要下载安装才可以使用.注:编辑的模块文件名不能与导入的模块名重复. 在模块文件中 ...

  3. android studio 的自动更新问题

    地址背墙了 没办法... 只有另寻他法了: 在Android Studio安装目录/bin/studio(对应版本, x86, x64).vmoptions文件中追加以下几行 -Djava.net.p ...

  4. day02HTML_CSS

    掌握表单标签 <form action="http://www.baidu.com" method="post"> ... </form> ...

  5. 【转】npm包管理器那些事

    原文链接:http://www.cnblogs.com/shuoer/p/7782125.html npm包管理器那些事! 今天和朋友针对npm包全局安装和本地项目安装这个梗展开的激烈的讨论,故此做一 ...

  6. Flask中使用Flask-Migrate扩展迁移数据库

    安装Flask-Migrate插件 (venv) $ pip install flask-migrate 注意到虚拟环境中(因为Flask环境就安装在虚拟环境中) 安装flask-script使pyt ...

  7. PHP7源码安装MongoDB和MongoDB拓展

    一.安装MongoDB 1.创建mongodb用户组和用户 groupadd mongodb useradd -r -g mongodb -s /sbin/nologin -M mongodb 2.下 ...

  8. webpack安装配置

    webpack安装 1.安装之前你必须要安装node.js,如果你没安装可以在node.js网去下载node.js 2.全局安装webpack,打开cmd输入npm install webpack - ...

  9. memset的实验

      关于memset的实验 实验一:memset对char数组赋初值 #include<iostream> using namespace std; int main() { char a ...

  10. Android HandlerThread 源码分析

    HandlerThread 简介: 我们知道Thread线程是一次性消费品,当Thread线程执行完一个耗时的任务之后,线程就会被自动销毁了.如果此时我又有一 个耗时任务需要执行,我们不得不重新创建线 ...