<!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. kali 2.0中msf连接postgres数据库

    装好kali 2.0后直接运行msfconsole msf> db_status postgres selected, no connection 百度到的解决方法多是针对BT和kali 1.0 ...

  2. AIO5销售发货单numeric算数溢出报错：将numeric转换成数据类型numeric时出现算数溢出错误

    问题描述: 销售发货单报错算数溢出:将numeric转换成数据类型numeric时出现算数溢出错误.具体如下图: 当销售发货单的数量为>7万时,报错 当销售发货单的数量为<7万时,单据正常 ...

  3. 最耗性能的SQL语句

    设计优化–常见杀手级SQL •SELECT * vsSELECT col1, col2 •ORDER BY RAND() •LIMIT huge_num, offset •SELECT COUNT(* ...

  4. 2017计算机学科夏令营上机考试-A判决素数个数

    A:判决素数个数 总时间限制:  1000ms 内存限制:  65536kB 描述 输入两个整数X和Y,输出两者之间的素数个数(包括X和Y). 输入 两个整数X和Y(1 <= X,Y <= ...

  5. Servlet&JSP-HTTP报文头获取及应用

    完整代码请参考:https://github.com/devway9/java-exercise/tree/master/servlet-jsp 目录 1 HttpServletRequest获取报文 ...

  6. leetcode算法题2: 合并两个二叉树。递归，如何切入并保持清醒？

    /* Given two binary trees and imagine that when you put one of them to cover the other, some nodes o ...

  7. 在没有DOM操作的日子里，我是怎么熬过来的（终结篇）

    前言 在我写终结篇的日子里,Vue版本稳定在2.9.1.当我摸清Vue的脉络之后,以一个爬坑无数的亲历者的身份,谈谈我在MVVM时代里遇到的那些事儿. 接下来,正文从这开始~ 好多童鞋学习Vue都有灯 ...

  8. CCF-201409-3-字符串匹配

    问题描述 试题编号: 201409-3 试题名称: 字符串匹配 时间限制: 1.0s 内存限制: 256.0MB 问题描述: 问题描述 给出一个字符串和多行文字,在这些文字中找到字符串出现的那些行.你 ...

  9. 数据结构与算法（C/C++版）【栈与队列】

    第三章<栈与队列> (一)栈简介  栈(Stack):只允许在一端进行插入或删除操作的线性表.首先栈是一种线性表,但是限定这种线性表只能在某一端进行插入和删除操作栈顶(top):线性表允许 ...

  10. oracle和mysql几点差异对比

    Oracle与mysql差异性总结 之前有个项目是用oracle数据库进行开发,需要把数据库改成mysql,遇到了一些地方需要注意的,就简单记了下来. 备注: 再把oracle转成mysql的时候,表 ...