最新的Web开发教程
 

W3.CSS排版


轻松阅读

W3.CSS页面很容易阅读,甚至对人有轻微的阅读障碍。

  • 使用的所有字体都容易可读15px的无衬线字体
  • 标准字体(宋体)有一个很好的字母间距
  • 标准行间距(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>
试一试»

字体大小类

标题应该用于它们是什么:标题。

随着W3.CSS,字体大小可通过类进行设置:

w3-tiny
w3-small
w3-medium (Default)
w3-large
w3-xlarge
w3-xxlarge
w3-xxxlarge
w3-jumbo
试一试»

覆盖标准

重写W3.CSS标准是很容易的。

你有至少三个简单的选择:

  1. 覆盖标准在你的页面的<head>部分
  2. 添加您自己的CSS文件W3.CSS后
  3. 下载和更改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="http://www.w3ii.com/lib/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}