這是用html和css寫出的頁面
怎么才能達(dá)到這種效果
先看源碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/index.css" />
<title></title>
</head>
<body>
<div>
<h1>春</h1>
<p>盼望著笆环，盼望著因悲，東風(fēng)來了像吻，春天的腳步近了峻黍，一切都像剛睡醒的樣子，欣欣然張開了眼拨匆。山朗潤起來了姆涩，水漲起來了，太陽的臉紅起來了惭每。
小草偷偷地從土里鉆出來骨饿，嫩嫩的，綠綠的台腥。園子里宏赘，田野里，瞧去黎侈，一大片一大片滿是的察署。坐著，躺著峻汉，打兩個(gè)滾箕母，踢幾腳球，賽幾趟跑俱济，捉幾回
迷藏嘶是。風(fēng)輕悄悄的，草綿軟軟的蛛碌。</p>
<p>桃樹聂喇、杏樹、梨樹，你不讓我希太，我不讓你克饶，都開滿了花趕趟兒。紅的像火誊辉，粉的像霞矾湃，白的像雪《槌危花里帶著甜味邀跃，閉了眼，樹上仿佛已
經(jīng)滿是桃兒蛙紫、杏兒拍屑、梨兒！花下成千成百的蜜蜂嗡嗡地鬧著坑傅，大小的蝴蝶飛來飛去僵驰。野花遍地是：雜樣兒，有名字的唁毒，沒名字的蒜茴，散在草叢里，
像眼睛浆西，像星星矮男，還眨呀眨的。</p>
</div>
</body>
</html>
div{
height: 600px;width: 416px;? /*定義盒子高度和寬度*/
border: solid 1px red;? ? ? /*border-width, border-style,和border-color.*/
padding: 115px 4em 0;
/*為了避免背景圖像重復(fù)平鋪到邊框區(qū)域室谚，應(yīng)禁止他平鋪*/
background: url(../img/p3.jpg) no-repeat;
/*設(shè)計(jì)背景圖像的定位坐標(biāo)點(diǎn)為元素邊框上的左上角*/
background-origin: border-box;? ? ? ? ? /*相對(duì)位置*/
background-size: cover;
overflow: hidden;? /*overflow屬性指定如果內(nèi)容溢出一個(gè)元素的框毡鉴，會(huì)發(fā)生什么。*/
/*visible 默認(rèn)值秒赤。內(nèi)容不會(huì)被修剪猪瞬，會(huì)呈現(xiàn)在元素框之外。
hidden ? ? ? ? ? 內(nèi)容會(huì)被修剪入篮，并且其余內(nèi)容是不可見的陈瘦。
scroll ? ? ? ? ? 內(nèi)容會(huì)被修剪，但是瀏覽器會(huì)顯示滾動(dòng)條以便查看其余的內(nèi)容潮售。
auto ? ? ? ? ? 如果內(nèi)容被修剪痊项，則瀏覽器會(huì)顯示滾動(dòng)條以便查看其余的內(nèi)容。
inherit 規(guī)定應(yīng)該從父元素繼承 overflow 屬性的值酥诽。*/
}
/*定義標(biāo)題*/
div h1{
font-size: 18px; font-family: "幼圓";
text-align: center;
}
/*定義文章*/
div p{
text-indent: 2em;/*text-indent 屬性規(guī)定文本塊中首行文本的縮進(jìn)*/
line-height: 2em;/*行高*/
font-family: "楷體";
margin-bottom: 2em;
}
后面的細(xì)節(jié)慢慢挑出來演示一下鞍泉。
