一,效果图。

二,代码。

<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title>CSS Fonts(字体)</title>
<style>
body {
font-size: 100%;
} h1 {
font-style: normal;
font-size: 40px;
font-size: 2.5em;
} p.serif {
font-family: "Times New Roman", Times, serif;
font-style: italic;
font-size: 30px;
font-size: 1.875em;
} p.sansserif {
font-family: Arial, Helvetica, sans-serif;
font-style: oblique;
font-size: 14px;
font-size: 0.875em;
}
</style>
</head> <body>
<h1>css font-family</h1>
<p class="serif">this is a paragrapth,shown in the times new Roman font.</p>
<p class="sansserif">this is a paragraph,shown in the arial font.</p>
</body> </html>

参考资料:《菜鸟教程》

【代码笔记】Web-CSS-CSS Fonts(字体)的更多相关文章

  1. Python学习笔记整理总结【web基础】【web/HTML/CSS/JavaScript/DOM/jQuery】

    一.HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以 ...

  2. 工作笔记——web字体格式转换

    转载自:http://blog.csdn.net/xiaolongtotop/article/details/8316554 目前,文字信息仍是网站最主要的内容,随着CSS3技术的不断成熟,Web字体 ...

  3. WEB前端 CSS(非布局)

    目录 WEB前端 CSS CSS引入方式 CSS结构 CSS选择器 直接选择器 组合选择器 分组选择器 也叫并集选择器 属性选择器 伪类选择器 伪元素选择器 CSS选择器是一个查找的过程,高效的查找影 ...

  4. CSS 天坑 I - 字体单位

    首先,本文所讨论的“坑”是在做回应式网页设计( Responsive Web Design 以下简称 RWD)时显现的,如果你还只是在做传统的Web设计这算不上是一个坑,因为传统的Web页面是死的,不 ...

  5. CSS3基础——笔记+实战案例(CSS基本用法、CSS层叠性、CSS继承性)

    CSS3基础——笔记 CSS是Cascading Style Sheet的缩写,翻译为"层叠样式表" 或 "级联样式表".CSS定义如何显示HTML的标签央视, ...

  6. jsDelivr - Free open source CDN for javascript libraries, jQuery plugins, CSS frameworks, Fonts and more

    jsDelivr - Free open source CDN for javascript libraries, jQuery plugins, CSS frameworks, Fonts and ...

  7. Web云笔记--CSS

    CSS CSS CSS Web自学第二阶段之CSS 参考资料:<Head First HTML&CSS>(中文第二版)(美国)弗里昂ISBN:9787508356464 中国电力出 ...

  8. 写给自己的web总结——css篇(1)

    上一篇写了关于html的知识,算是小试牛刀,这次来尝试写一下css. 初步了解css css的全称为cascading style sheet-- 层叠样式表,通过编入代码来对html里的标签做出各种 ...

  9. 【CSS学习】--- 字体样式

    一.前言 CSS字体属性可以定义文本的字体系列.大小.加粗.颜色.风格(如斜体)和变形(如小型大写字母). CSS的字体属性: font-family 设置字体系列 font-size 设置字体的尺寸 ...

随机推荐

  1. 3-2 Hadoop集群伪分布模式配置部署

    Hadoop伪分布模式配置部署 一.实验介绍 1.1 实验内容 hadoop配置文件介绍及修改 hdfs格式化 启动hadoop进程,验证安装 1.2 实验知识点 hadoop核心配置文件 文件系统的 ...

  2. PostgreSQL+PostGIS 的使用

    一.PostGIS中的几何类型 PostGIS支持所有OGC规范的“Simple Features”类型,同时在此基础上扩展了对3DZ.3DM.4D坐标的支持. 1. OGC的WKB和WKT格式 OG ...

  3. 如何在微信小程序定义全局变量、全局函数、如何实现 函数复用 模块化开发等问题详解

    1.如何定义全局数据 在app.js的App({})中定义的数据或函数都是全局的,在页面中可以通过var app = getApp();  app.function/key的方式调用,不过我们没有必要 ...

  4. 惊奇!用Java也能实现比特币系统

    最近区块链技术突然爆火,身边做技术的朋友茶余饭后不谈点区块链什么的都被认为是跟不上时代了,为啥会这样了? 这其实跟比特币价格去年的突飞猛进是分不开的,比特币价格从去年初不到一千美金到今年初最高接近两万 ...

  5. [Swift]LeetCode160. 相交链表 | Intersection of Two Linked Lists

    Write a program to find the node at which the intersection of two singly linked lists begins. For ex ...

  6. [Swift]LeetCode700. 二叉搜索树中的搜索 | Search in a Binary Search Tree

    Given the root node of a binary search tree (BST) and a value. You need to find the node in the BST ...

  7. 准备PPT过程中的一些文档记录

    http://jm.taobao.org/2016/12/23/20161223/ https://www.csdn.net/article/2015-02-10/2823900 https://da ...

  8. MVC从路由到Controller运行机制

    下图中每个箭头的左侧对应的右侧方法为对象调用方法的过程: 由于UrlRoutingModule这个HttpModule被注册到Web应用中,所有对每个抵达的请求来说,当代表当前应用的HttpAppli ...

  9. 使用ML.NET实现猜动画片台词

    前面几篇主要内容出自微软官方,经我特意修改的案例的文章: 使用ML.NET实现情感分析[新手篇] 使用ML.NET预测纽约出租车费 .NET Core玩转机器学习 使用ML.NET实现情感分析[新手篇 ...

  10. Nancy in .NET Core学习笔记 - 路由

    前文中,我介绍了Nancy的来源和优点,并创建了一个简单的Nancy应用,在网页中输出了一个"Hello World",本篇我来总结一下Nancy中的路由 Nancy中的路由的定义 ...