<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> * { margin: 0px; padding: 0px; } #div1 { 700px; margin: 0 auto; } .div2 { background: url(banner1.jpg) no-repeat; 800px; height: 166px; } #p1 { position: relative; left: 540px; color: white; top: 70px; } #ul1 { background: blue; list-style: none; } li { position: relative; float: left; top: 125px; 100px; text-align: center; } .divft { float: left; background: url(container_bg.jpg) repeat-y; 160px; height: 600px; font-size: 14px; } #divright { 700px; height: 600px; background: url(bg1.jpg) no-repeat; background-size: 100%; font-size: 14px; } .p1 { 140px; } .span1 { font-size: 30px; color: blue; text-decoration: blue underline; } #footer { clear: both; text-align: center; background: url(container_bg.jpg) repeat-y; } </style> </head> <body> <div id="div1"> <div class="div2"> <p id="p1"> 学号姓名</p> <ul id="ul1"> <li>首页</li> <li>心情日记</li> <li>Free</li> <li>一起走到</li> <li>从明天起</li> <li>纸飞机</li> <li>下一站</li> </ul> </div> <div class="mianconter"> <div class="divft"> <img src="selfpic1.jpg" alt=""> <div class="p1"> <br> 我的日记本 <br> 秋天过半的时候，我搭上了一列火车。我不知道它将要去往的方向， 那铁路看上去无休无止地延伸着。 </div> <br> <img src="selfpic2.jpg" alt=""> <div class="p1"> <br> 我的日记本 <br> 秋天过半的时候，我搭上了一列火车。我不知道它将要去往的方向， 那铁路看上去无休无止地延伸着。 </div> </div> <div id="divright"> <div id="bo"> <span class="span1">介绍</span> <br> 火车经过一个又一个站台，窗外漫卷的蒲公英向我微笑着。我逐渐记起了自己旅行的目的， 一直都在下一站的前方。火车缓缓地驶入站台，汽笛声响的那一瞬间， 车厢变得透明，我看见，自己和这长长的列车一起，正在漫天飘舞着的蒲公英中飞行。 <br> <br> <span class="span1">转播设备</span> <br> 我现在是在万泉河附近，我们的转播车就在旁边不远的地方，师傅马上将会把车开过来。 我们的转播设备非常的先进，具体怎么先进我也说不清，师傅比我清楚 ，总之就是特别特别先进。好，现在师傅已经把转播车开过来了。…… <br> <br> <span class="span1">旅程</span> <br> 夕阳 染红蓝天 带走 美好的一天 风 吹过大地 炫美的世界 霞光 点亮星辰 燃起 辽远的梦幻 流星 划过夜空 忆起 逝夜的歌声 是谁昨夜背上行囊 唱一首满载风尘的歌 今夜才又想起拥抱的时刻 独自走的一段旅程 是否还装满苦涩 一路风雨飘摇 那坎坷对谁说 来吧看这远处亮起的点点星火 伸手触摸那写在匆匆旅程的歌 谁在转过的街口从容挥手 谁用欢笑和拥抱 记住这一刻 </div> </div> </div> <div id="footer"> <p>版权所有 2016 5-17107332-于超</p> </div> </div> </body> </html>