1 2 3 4 5 Title 6 66 67 68 69 ———中華瑰寶，絕美唐詩。 70 71 72 73 向晚意不適， 74 驅車登古原。 75 夕陽無限好， 76 ... ...
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <style> 7 .nav{ 8 width: 600px; 9 height: 120px; 10 background: url("images/07.jpg"); 11 border: 1px solid red; 12 position: relative; 13 margin: 5px auto; 14 } 15 .nav span{ 16 font-size: 26px; 17 position: absolute; 18 bottom: 15px; 19 right: 20px; 20 } 21 .wrap{ 22 position: relative; 23 margin: 0 auto; 24 width: 600px; 25 height: 600px; 26 border: 1px solid red; 27 } 28 .top{ 29 width: 400px; 30 height: 400px; 31 margin: 0 auto; 32 } 33 .top .img{ 34 width: 400px; 35 height: 400px; 36 position: absolute; 37 top:2px; 38 left:100px; 39 border-radius: 50%; 40 } 41 .tex1{ 42 width: 600px; 43 height: 190px; 44 text-align: center; 45 padding: 30px; 46 box-sizing: border-box; 47 font-size: 26px; 48 } 49 .footer{ 50 width: 600px; 51 height: 120px; 52 margin:0 auto; 53 background: url("images/07.jpg"); 54 border: 1px solid red; 55 position: relative; 56 margin-bottom: 5px; 57 } 58 .footer span{ 59 font-size: 26px; 60 position: absolute; 61 bottom: 15px; 62 right: 20px; 63 } 64 65 </style> 66 </head> 67 <body> 68 <div class="nav"> 69 <span>———中華瑰寶，絕美唐詩。</span> 70 </div> 71 <div class="wrap"> 72 <div class="top"><img class="img" src="images/01.jpg" alt=""></div> 73 <div class="tex1">向晚意不適，<br> 74 驅車登古原。<br> 75 夕陽無限好，<br> 76 只是近黃昏。</div> 77 </div> 78 <div class="wrap"> 79 <div class="top"><img class="img" src="images/05.jpg" alt=""></div> 80 <div class="tex1">天街小雨潤如酥，<br> 81 草色遙看近卻無。<br> 82 最是一年春好處，<br> 83 絕勝煙柳滿皇都。</div> 84 </div> 85 <div class="wrap"> 86 <div class="top"><img class="img" src="images/06.jpg" alt=""></div> 87 <div class="tex1">泉眼無聲惜細流，<br> 88 樹蔭照水愛晴柔。<br> 89 小荷才露尖尖角，<br> 90 早有蜻蜓立上頭。</div> 91 </div> 92 <div class="wrap"> 93 <div class="top"><img class="img" src="images/04.jpg" alt=""></div> 94 <div class="tex1">橫看成嶺側成峰，<br> 95 遠近高低各不同。<br> 96 不識廬山真面目，<br> 97 只緣生在此山中。</div> 98 </div> 99 <div class="wrap"> 100 <div class="top"><img class="img" src="images/09.jpg" alt=""></div> 101 <div class="tex1">遠上寒山石徑斜，<br> 102 白雲生處有人家。<br> 103 停車坐愛楓林晚，<br> 104 霜葉紅於二月花。</div> 105 </div> 106 <div class="wrap"> 107 <div class="top"><img class="img" src="images/010.jpg" alt=""></div> 108 <div class="tex1">一帆一江一漁舟，<br> 109 一個漁翁一釣鉤。<br> 110 一俯一仰一場笑，<br> 111 一江明月一江秋。</div> 112 </div> 113 <div class="wrap"> 114 <div class="top"><img class="img" src="images/012.jpg" alt=""></div> 115 <div class="tex1">獨坐池塘如虎踞，<br> 116 綠蔭樹下養精神。<br> 117 春來我不先開口，<br> 118 哪個蟲兒敢作聲。</div> 119 </div> 120 <div class="wrap"> 121 <div class="top"><img class="img" src="images/015.jpg" alt=""></div> 122 <div class="tex1">咬定青山不放鬆，<br> 123 立根原在破岩中。<br> 124 千磨萬擊還堅勁，<br> 125 任爾東西南北風。</div> 126 </div> 127 <div class="wrap"> 128 <div class="top"><img class="img" src="images/016.jpg" alt=""></div> 129 <div class="tex1"> 聞道梅花圻曉風，<br> 130 雪堆遍滿四山中。<br> 131 何方可化身千億，<br> 132 一樹梅花一放翁。</div> 133 </div> 134 <div class="wrap"> 135 <div class="top"><img class="img" src="images/018.jpg" alt=""></div> 136 <div class="tex1"> 碧玉妝成一樹高，<br> 137 萬條垂下綠絲絛。<br> 138 不知細葉誰裁出，<br> 139 二月春風似剪刀。</div> 140 </div> 141 <div class="wrap"> 142 <div class="top"><img class="img" src="images/021.jpg" alt=""></div> 143 <div class="tex1"> 畢竟西湖六月中，<br> 144 風光不與四時同。<br> 145 接天蓮葉無窮碧，<br> 146 映日荷花別樣紅。</div> 147 </div> 148 <div class="footer"> 149 <span>———中華瑰寶，絕美唐詩。</span> 150 </div> 151 </body> 152 </html>
