創(chuàng)建一個博客
在整個課程中，我們將幫助你練習(xí)并創(chuàng)建你自己的博客項目，你需要積累所學(xué)到的知識，并將其應(yīng)用。繼續(xù)學(xué)習(xí)，按照“任務(wù)”部分的說明進(jìn)行操作，最終，完成創(chuàng)建自己的博客頁面。
下面就是你要完成的博客頁面，點擊 “運行實例” 查看代碼及其輸出。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>我的博客</title> <link href="http://www.miracleart.cn/blog.css" rel="stylesheet" type="text/css" /> </head> <body> <!-- header start --> <div id="header" class="section"> <img src="https://http://www.miracleart.cn/avatar.png" alt="頭像" class="img-circle" /> <p>W3Cschool小師妹</p> </div> <!-- header end --> <!-- About Me section start --> <div class="section"> <h2><span>關(guān)于我</span></h2> <p>嘿！我是<strong>小師妹</strong>。編碼改變了我的世界。它不僅僅是應(yīng)用程序。學(xué)習(xí)代碼給了我解決問題的技能和在技術(shù)層面與他人溝通的途徑。我也可以開發(fā)網(wǎng)站，并使用我的編程技術(shù)來獲得更好的工作。我是在 <strong>W3Cschool</strong> 學(xué)到了所有這些，這讓我也保持了對學(xué)習(xí)編程的積極性。加入我這個有益的學(xué)習(xí)旅程。沿途你會獲得樂趣，得到幫助，學(xué)習(xí)更多知識！</p> <p class="quote">"I love coding, I love php!"</p> </div> <!-- About Me section end --> <!-- My Schedule section start --> <div class="section"> <h2><span>我的時間表</span></h2> <table> <tr> <th>Day</th> <th>Mon</th> <th>Tue</th> <th>Wed</th> <th>Thu</th> <th>Fri</th> </tr> <tr> <td>8:00-8:30</td> <td class="selected">Learn</td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td>9:00-10:00</td> <td></td> <td class="selected">Practice</td> <td></td> <td></td> <td></td> </tr> <tr> <td>10:00-13:30</td> <td></td> <td></td> <td class="selected">Play</td> <td></td> <td></td> </tr> <tr> <td>15:45-17:00</td> <td></td> <td></td> <td></td> <td class="selected">Code</td> <td></td> </tr> <tr> <td>18:00-18:15</td> <td></td> <td></td> <td></td> <td></td> <td class="selected">Discuss</td> </tr> </table> </div> <!-- My Schedule section end --> <!-- My Skills section start --> <div class="section"> <h2><span>我的技能</span></h2> <ul> <li>HTML</li> <li>CSS</li> <li>JavaScript</li> </ul> </div> <!-- My Skills section end --> <!-- Media section start --> <div class="section"> <h2><span>我的媒體</span></h2> <iframe height="240" width="320" src="http://www.miracleart.cn/demosource/movie.mp4" allowfullscreen frameborder="0"></iframe> </div> <!-- Media section end --> <!-- Contact section start --> <div class="section"> <h2><span>聯(lián)系我</span></h2> <form> <input name="name" placeholder="Name" type="text" required /><br/> <input name="email" placeholder="Email" type="email" required /><br/> <textarea name="message" placeholder="Message" required ></textarea> <input type="submit" value="發(fā)送" class="submit" /> </form> </div> <!-- Contact section end --> <!-- Follow section start --> <div class="section" id="follow"> <h2><span>關(guān)注我</span></h2> <div> <a href="#"> <img alt="qq" src="http://www.miracleart.cn/blog/qq.png" /> </a> <a href="#"> <img alt="weixin" src=http://www.miracleart.cn/blog/weixin.png"/> </a> <a href="#"> <img alt="weibo" src="http://www.miracleart.cn/blog/weibo.png" /> </a> </div> </div> <!-- Follow section end --> <div class="copyright"> ? 2017 My Blog. All rights reserved. </div> </body> </html>
點擊 "運行實例" 按鈕查看在線實例
不要害怕頁面代碼長，當(dāng)你完成課程時，一切都將非常有意義！
任務(wù)：更改文檔標(biāo)題，將文檔標(biāo)題更改為你自己想要輸入的名稱。請記住，文檔標(biāo)題位于頁面 <head> 中的 <title> 標(biāo)簽內(nèi)。
<html> <head> <title>我的博客</ > </head> </html>
