HTML+CSS做一個個人簡歷
阿新 • • 發佈：2018-12-19
程式碼：
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset=utf-8" /> <title>簡歷</title> <style> *{ margin: 0; padding: 0; } body{ width:%100; height:%100; text-align:center; background-color:#272727; } .class1{ width:300px; height:1000px; background-color:#666666; float:left; color :white; } .class2{ height:950px; background-color:#669999; margin-left: 220px; text-align:left; color:black; } .class3{ height:50px; background-color:#333333; color:white; } .class4{ margin-top:50px; } ul{ margin:0; padding:0; color:white; padding-left: 100px; text-align:left; } hr{ height: 2px; background-color: black; border: 0; } p{ font-size:20px; } table, td, th { border:1px solid green; } </style> </head> <body> <div class="class1"> <div class="class4"> <img src="4.png"> </div> <img src="5.png"align="left"> <h1>個人資訊</h1> <br/> <ul> <li>姓名：xxxxxxx</li> <br/> <li>出生年月：xxxxxxx</li> <br/> <li>籍貫：湖北武漢</li> <br/> <li>學歷：本科</li> <br/> <li>民族：漢</li> </ul> <br/> <img src="6.png"align="left"> <h1>聯絡方式</h1> <ul> <li>qq：xxxxxxxxxx</li> <br/> <li>電話：xxxxxxxxxxx</li> <br/> <li>微信：xxxxxxxxxxxx</li> <br/> <li>地址：xxxxx</li> </ul> <br/> <img src="10.png"align="left"> <h1>興趣愛好</h1> <div class="pic"> <ul> <li><img src="7.png"/></li> <li><img src="8.png"/></li> <li><img src="9.png"/></li> </ul> </div> </div> <div class="class3"> <h1>個人簡歷</h1> </div> <div class="class2"> <br/> <br/> <img src="11.png"align="left"> <h1>自我評價</h1> <br/> <hr/> <p> 本人性格開朗、誠實正直、做事認真踏實、工作兢兢業業、<br/>有較強的組織能力、寫作能力和團隊協作精神，能迅速的<br/>適應各種環境並融合其中。自參加工作以來，所受到的教<br/>育及鍛鍊使我能夠熟練的管理工作，能獨立處理工作中出<br/>現的問題。 </p> <img src="12.png"align="left"> <h1>教育經歷</h1> <br/> <hr/> <p> 畢業學校：湖北大學            時間：在讀 </p> <br/> <br/> <br/> <br/> <img src="13.png"align="left"> <h1>工作經驗</h1> <br/> <hr/> <p> 工作時間：xxxxx           工作單位：xxxxxx<br/> 工作時間：xxxxx           工作單位：xxxxxx </p> </div> </body> </html>
效果圖：
