題目:
? ??????設(shè)計(jì)如圖所示的一個(gè)頁面

???
代碼:
html:
<!DOCTYPE?html>
<html?lang="en">
<head>
????<meta?charset="UTF-8">
????<title>詩《初相遇》</title>
????<link?rel="stylesheet"?href="./css/fontsize.css">
</head>
<body>
???<div>
???????<h1>
????????初相遇????????<span>文/席慕容</span>
???????</h1>
????????<p>
????????????<span?class="two">美</span>麗的夢和美麗的詩一樣,都是可遇而不可求的,常常在最沒能料到的時(shí)刻里出現(xiàn)。
????????</p>
????????<p>我喜歡那樣的夢,在夢里,一切都可以重新開始,一切都可以慢慢解釋,心里甚至還能感覺到,所有被浪費(fèi)的時(shí)光竟然都能重回時(shí)的狂喜與感激。<span?class="three">胸懷中滿溢著幸福,只因你就在我眼前</span>,對我微笑,一如當(dāng)年。</p>
????<p>
????????我喜歡那樣的夢,明明知道你已為我跋涉千里,卻又覺得芳草鮮美,落落英繽紛,好像你我才初相遇。
????</p>
???</div>
</body>
</html>
css:
div
{
????background:?-moz-linear-gradient(#CAEFFE,#FFFFED);
????width:500px;
}
h1
{
????font-size:?24px;
????font-weight:?lighter;
????text-align:center;
????color:#06F;
????line-height:?1.8;
????text-shadow:?darkgray?1px?1px?1px;
}
h1?span
{
????font-size:?12px;
????color:#808080;
????font-weight:?200;
????text-shadow:?darkgray?1px?1px?1px;
}
p
{
????font-size:?12px;
????text-indent:?2em;
????line-height:?22px;
}
p?.two
{
????color:#FF1493;
????font-size:?18px;
????font-weight:?bold;
????text-shadow:??black?2px?2px?2px?;
}
p?.three
{
????font-style:?italic;
????font-weight:?bold;
????color:darkorange;
????font-size:?16px;
}
p:last-child
{
????color:green?;
????text-decoration:?underline;
}
運(yùn)行結(jié)果:
