<!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. Qt----拖拽

    最近比较忙,今天此才有时间来继续学习下Qt.Qt的拖拽可以按字面意思分为拖和拽两部分.一般来说我们常见的拖拽分别由两个程序合作完成.例如我们经常把桌面的文件拖拽进其他目录: 这个拖拽在Qt中由两方合作 ...

  2. python 保存命令执行结果

    保存命令执行的结果需哟使用os.popen("系统命令").read(),然后使用变量赋值输出即可 >>> result = os.popen("df ...

  3. windows下忘记mysql的root密码解决方法(图文)

    在windows下忘记mysql的root密码对于很对新手来说,也是会经常遇到的,我也刚好遇到啦,参考网上的解决办法,自己又整理啦一下. 1.首先需要查看mysql的服务是否启动. 打开cmd窗口,输 ...

  4. 项目实战9—企业级分布式存储应用与实战MogileFS、FastDFS

    企业级分布式存储应用与实战-mogilefs 环境:公司已经有了大量沉淀用户,为了让这些沉淀用户长期使用公司平台,公司决定增加用户粘性,逐步发展基于社交属性的多样化业务模式,决定开展用户讨论区.卖家秀 ...

  5. 给负载均衡器添加多IP

    看到一个场景,针对web应用的一个需求,需要在负载均衡器设置多个公网ip. 给负载均衡器添加多个公共ip 创建多个虚拟机,同时把他们添加到同一个可用性集中,方便后期部署到负载均衡器. 创建多个公网ip ...

  6. [PHP]Symfony or Laravel 在 console 中结合 Workerman

    在web框架的console中,命令不再是直接指定入口文件,如以往 php test.php start,而是类似 php app/console do 的形式. workerman 对命令的解析是 ...

  7. POJ 1151 Wormholes spfa+反向建边+负环判断+链式前向星

    Wormholes Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 49962   Accepted: 18421 Descr ...

  8. C# 通过反射初探ORM框架的实现原理

    背景: 以前学的Java进行开发,多用到Mybatis,Hiberante等ORM框架,最近需要上手一个C#的项目,由于不是特别难,也不想再去学习C#的ORM框架,所以就想着用反射简单的实现一下ORM ...

  9. c# 初识WPF

    WPF,全名是Windows Presentation Foundation,是微软在.net3.0 WinFX中提出的.WPF是对Direct3D的托管封装,它的图形表现依赖于显卡.当然,作为一种更 ...

  10. Spring Cloud 前后端分离后引起的跨域访问解决方案

    背景 Spring Cloud 微服务试点改造,目前在尝试前后端分离. 前台A应用(本机8080端口),通过网管(本机8769端口)调用后台应用B(本机8082端口).应用C发布的http服务.. A ...