我的博客网站html文件

 

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>我的博客网站</title>
  6     <link rel="stylesheet" href="css/index.css">
  7 </head>
  8 <script src="js/jquery-3.2.1.min.js"></script>
  9 <script src="js/main.js"></script>
 10 <body>
 11     <div id="wrap">
 12         <header class="header">
 13             <nav>
 14                 <ul class="nav_ul">
 15                     <li class="logo"><a href="#">荒城</a></li>
 16                     <li id="silder_bar"><a href="#">侧栏菜单</a></li>
 17                     <li><a href="#">天页</a><span></span></li>
 18                     <li><a href="#">地页</a><span></span></li>
 19                     <li class="active"><a href="#">首页</a><span></span></li>
 20                 </ul>
 21             </nav>
 22         </header>
 23     
 24     <div class="banner">
 25         <div class="inner">
 26             <div class="line"></div>
 27             <p><h1>荒城老师</h1></p>
 28             <div class="line"></div>
 29             <p>Email:345666999@QQ.com</p>
 30             <p>51自学网欢迎您</p>
 31             <p>快乐学习每一天</p>
 32             <button>摸摸我</button>
 33             <div class="more">更多...</div>
 34         </div>
 35     </div>
 36     <div class="content">
 37         <section class="part1">
 38           <div class="wraper">
 39             <h1>春花秋月何时了</h1>
 40             <div class="line"></div>
 41             <p>桃源铜仁，绿色崛起。铜仁地处武陵山脉腹地，历史悠久，享有“黔东明珠”之美誉。这里居住着汉族、苗族、侗族、土家族等29个民族，民族风情浓郁迷人，人文景观绚丽多彩，自然风光神奇秀丽。</p>
 42             <p>台办发言人马晓光表示，台湾是中国的一部分。</p>
 43             <div class="icon">
 44                 <span class="item"><img src="./img/钻石.svg" alt=""></span>
 45                 <span class="item"><img src="./img/程序.svg" alt=""></span>
 46                 <span class="item"><img src="./img/爱心.svg" alt=""></span>
 47             </div>    
 48           </div>
 49         </section>
 50         <section class="part2">
 51             <div class="first clear_fix">
 52                 <div class="first_left">
 53                     <img src="./img/pic01.jpg" alt="沙滩">
 54                 </div>
 55                 <div class="first_right">
 56                     <div class="first_text">
 57                         <h2>思念是一种病</h2>
 58                         <div class="first_title">
 59                             而我却已病入膏肓
 60                         </div>
 61                         <p>那一年南国之南，你如灼目之阳。最是那一低头的温柔，恰似水莲花不胜凉风的娇羞</p>
 62                     </div>
 63                 </div>
 64             </div>
 65             <div class="first clear_fix">
 66                 <div class="first_right">
 67                     <div class="first_text">
 68                         <h2>北国之春</h2>
 69                         <div class="first_title">
 70                             暖阳如你
 71                         </div>
 72                         <p>那是我经常走的一条小巷，遇见了你和我的青春</p>
 73                     </div>
 74                 </div>
 75                 <div class="first_left">
 76                     <img src="./img/pic02.jpg" alt="日本夜景">
 77                 </div>                
 78             </div>
 79             <div class="first clear_fix">
 80                 <div class="first_left">
 81                     <img src="./img/pic03.jpg" alt="雪景">
 82                 </div>
 83                 <div class="first_right">
 84                     <div class="first_text">
 85                         <h2>相信未来</h2>
 86                         <div class="first_title">
 87                             山崩地裂
 88                         </div>
 89                         <p>当蜘蛛网无情地查封了我的炉台，
 90                         当灰烬的余烟叹息着贫困的悲哀，
 91                         我依然固执地铺平失望的灰烬，
 92                         用美丽的雪花写下：相信未来。
 93                         当我的紫葡萄化为深秋的露水，</p>
 94                     </div>
 95                 </div>
 96             </div>            
 97         </section>
 98         <section class="part-three">
 99           <div class="part-three_wrap">
100             <div class="three_wrap">
101                 <h2>相信未来</h2>
102                 <div class="line">
103                 </div>
104                 <div>当我的鲜花依偎在别人的情怀，
105                     我依然固执地用凝霜的枯藤，
106                     在凄凉的大地上写下：相信未来。
107                     我要用手指那涌向天边的排浪，
108                     我要用手掌 那托起太阳的大海，
109                     摇曳着曙光那支温暖漂亮的笔杆，
110                     用孩子的笔体写下：相信未来。</div>
111             </div>
112             <div class="card_grop clear_fix">
113                 <div class="card">
114                     <h3>believe future</h3>
115                     <p>我之所以坚定地相信未来，
116                         是我相信未来人们的眼睛——
117                         她有拨开历史风尘的睫毛，
118                         她有看透岁月篇章的瞳孔。
119                          </p>
120                 </div>
121                 <div class="card">
122                     <h3>believe future</h3>
123                     <p>不管人们对于我们腐烂的皮肉，
124                         那些迷途的惆怅，失败的苦痛，
125                         是寄予感动的热泪，深切的同情，
126                         还是给以轻蔑的微笑，辛辣的嘲讽。</p>
127                 </div>
128                 <div class="card">
129                     <h3>believe future</h3>
130                     <p>我坚信人们对于我们的脊骨，
131                         那无数次地探索、迷途、失败和成功，
132                         一定会给予热情、客观、公正的评定，
133                         是的，我焦急地等待着他们的评定。
134                          </p>
135                 </div>
136                 <div class="card">
137                     <h3>believe future</h3>
138                     <p>朋友，坚定地相信未来吧，
139                         相信不屈不挠的努力，
140                         相信战胜死亡的年轻，
141                         相信未来，热爱生命。 </p>
142                 </div>
143                 <div class="card">
144                     <h3>believe future</h3>
145                     <p>当蜘蛛网无情地查封了我的炉台，
146                         当灰烬的余烟叹息着贫困的悲哀，
147                         我依然固执地铺平失望的灰烬，
148                         用美丽的雪花写下：相信未来。
149                         当我的紫葡萄化为深秋的露水，</p>
150                 </div>
151                 <div class="card">
152                     <h3>believe future</h3>
153                     <p>当我的鲜花依偎在别人的情怀，
154                         我依然固执地用凝霜的枯藤，
155                         在凄凉的大地上写下：相信未来。
156                         我要用手指那涌向天边的排浪，
157                         我要用手掌 那托起太阳的大海，
158                         摇曳着曙光那支温暖漂亮的笔杆，
159                         用孩子的笔体写下：相信未来。 </p>
160                 </div>
161             </div>
162           </div>
163         </section>
164     </div> <!-- end of content -->
165     <footer class="footer">
166         <ul class="share_group">
167             <li>星期一</li>
168             <li>星期二</li>
169             <li>星期三</li>
170             <li>星期四</li>
171             <li>星期五</li>
172         </ul>
173         <div  class="copy">
174             &copy 荒城2017-12
175             <a href="../苏宁易购/index.html">苏宁链接</a>
176         </div>
177     </footer>
178     <div class="mask">    </div>
179     <div id="silder">
180         <ul>
181             <li><a href="#">我是唐三藏</a> </li>
182             <li><a href="#">我是孙行者</a> </li>
183             <li><a href="#">我是猪八戒</a> </li>
184             <li><a href="#">我是沙和尚</a> </li>
185             <li><a href="#">我是白骨精</a> </li>
186         </ul>
187     </div>
188     <div class="top">
189         <a href="#">
190             <img src="img/向上箭头.svg" alt="top" title="Top">
191         </a>
192     </div>
193   </div>  <!-- wrap -->
194 </body>
195 </html>

 

posted @ 2022-07-22 12:22  paoPaoLong_liu  阅读(52)  评论(0)    收藏  举报