W3.CSS 字体
易于阅读
W3.CSS 页面易于阅读，即使对于有轻微阅读障碍的人也是如此。
- W3.CSS 默认字体大小为 15px
- 默认字体是Verdana，字间距合适
- 默认行距 (1.5) 也很好
HTML 标题 <h1> - <h6>
默认情况下，W3.CSS 以这种方式设置 HTML 标题样式:
实例
<h1>Heading 1 (36px)</h1>
<h2>Heading 2 (30px)</h2>
<h3>Heading 3 (24px)</h3>
<h4>Heading 4 (20px)</h4>
<h5>Heading 5 (18px)</h5>
<h6>Heading 6 (16px)</h6>
亲自试一试 »
Font-Size 类
标题应该用于它们的内容: Headings.
使用 W3.CSS，可以通过以下 w3-size 类设置字体大小:
覆盖 W3.CSS 默认值
覆盖 W3.CSS 默认设置非常容易。
你至少有三个选择:
- 覆盖页面 <head> 部分中的默认设置
- 在W3.CSS之后添加自己的CSS文件
- 下载并更改 W3.CSS 文件的内容
在 <head> 中覆盖
h1{font-size:64px;}
h2{font-size:48px;}
h3{font-size:36px;}
h4{font-size:24px;}
h5{font-size:20px;}
h6{font-size:18px;}
亲自试一试 »
添加您自己的 CSS
<link rel="stylesheet" href="https://www.w3ccoo.com/w3css/4/w3.css">
<link rel="stylesheet"
href="myStyle.css">
修改 W3.CSS
h1{font-size:36px} h2{font-size:30px} h3{font-size:24px} h4{font-size:20px} h5{font-size:18px} h6{font-size:16px}
更改默认页面字体
在你的网页头部（或者你的样式表），加载W3.CSS后，改变html和body的样式:
实例
<link rel="stylesheet" href="https://www.w3ccoo.com/w3css/4/w3.css">
<style>
html, body, h1, h2, h3, h4, h5, h6 {
font-family: "Comic Sans MS", cursive, sans-serif;
}
</style>
亲自试一试 »
W3.CSS 外部字体
Making the web beautiful!
使用 W3.CSS 可以非常容易地向网页添加新字体。
- 非常易于使用（仅 CSS 和 HTML）
- 无限制地使用外部字体库（如 Google 字体）
- 适用于所有现代浏览器
使用 Font 字体类
Making the Web!
在你的网页头部（或者你的样式表），创建一个字体类:
实例
.w3-myfont {
font-family: "Comic Sans MS", cursive, sans-serif;
}
在网页正文中，使用字体类名称:
使用外部字体
在网页的头部，包含一个外部字体，并给字体一个类名:
实例
<link rel="stylesheet" href="/fonts/css.asp?family=Tangerine">
<style>
.w3-tangerine {
font-family: 'Tangerine', serif;
}
</style>
在网页正文中，使用类名:
更多实例
Making the Web!
Making the Web!
Making the Web!
字体效果在 Internet Explorer 9 及更早版本中不起作用。
