我想使用 Twitter bootstrap 作为前端框架和 Typeplate 进行排版。
可以从以下 URL 下载相应的框架并免费使用。
http://twitter.github.com/bootstrap/ http://typeplate.com/
两个框架中都定义了少数 HTML 元素的 CSS 类(例如,HTML、body、h1)
我在 Typeplate 网站上运行了 Firebug,看到了 font-family 和 font-size 等计算字段的值......即使我在我的网站中为 css 使用相同的值(即使在删除引导 css 之后),我也无法获得打字机的排版。
我在 twitter bootstrap 之后使用 typeplate。
请指教。
基本上我想在下面的代码中合并应用于文本“快乐王子”的属性
<html class="no-js wf-ffmetaserifwebpro-i7-active wf-ffmetaserifwebpro-i5-active wf-ffmetaserifwebpro-n5-active wf-ffmetaserifwebpro-n7-active wf-active">
<head><style>
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary
{
display: block;
}
html
{
font-family: sans-serif;
-ms-text-size-adjust: 100%;
}
body
{
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
h1
{
font-size: 2em;
margin-top: 0.67em;
margin-right: 0px;
margin-bottom: 0.67em;
margin-left: 0px;
}
html
{
line-height: 1.65;
font-family: serif;
font-size: 112.5%;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size-adjust: none;
font-stretch: normal;
}
body
{
color: #444444;
word-wrap: break-word;
}
h1, h2, h3, h4, h5, h6
{
line-height: 1;
margin-top: 0px;
}
h1, .alpha
{
font-size: 3.33rem;
margin-bottom: 0.49rem;
}
h1, h2, h3, h4, h5, h6
{
color: #222222;
}
body
{
margin-top: 6em;
margin-right: auto;
margin-bottom: 6em;
margin-left: auto;
max-width: 34em;
background-image: url("../img/subtle_grunge.png");
background-attachment: scroll;
background-repeat: repeat;
background-position-x: left;
background-position-y: top;
background-size: auto;
background-origin: padding-box;
background-clip: border-box;
background-color: transparent;
}
.wf-active body, .wf-inactive body
{
font-family: "ff-meta-serif-web-pro",serif;
font-weight: 400;
visibility: visible;
}
</style></head>
<body><section><article><header>
<h1>
The Happy Prince
</h1>
</header></article></section></body></html>
"