時(shí)間:2023-09-06 12:54:01 | 來源:網(wǎng)站運(yùn)營(yíng)
時(shí)間:2023-09-06 12:54:01 來源:網(wǎng)站運(yùn)營(yíng)
用html & css 制作個(gè)人簡(jiǎn)歷吧:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Resume</title> <style> /* 全局 */ *{ margin: 0; padding: 0; } .website{ color: salmon; font-size: 14px; font-weight: 500; } /* 頭部 */ header{ width: 100%; height: 200px; background: lightgoldenrodyellow; } img{ width: 300px; height: 200px; margin-left: 30px; float: left; } nav { float: left; margin-left: 30px; color: salmon; } nav > h1 { margin-top: 10px; font-size: 36px; font-weight: 200; } nav > h2,h4 { margin-top: 15px; } /* 正文 */ section{ width: 100%; height: 800px; background: #eae6e666; position: relative; } /* 側(cè)邊 */ .sideBar{ width: 300px; height: 100%; background: #9adab599; margin-left: 30px; } .sideBar > .personalInfo,.awards{ padding-left: 20px; } .sideBar > .selfEva{ padding: 0 5px; } .sideBar > div > h3{ color: brown; font-weight: 500; margin: 15px; } .personalInfo{ padding: 5px; } .personalInfo > ul > li{ margin-top: 8px; } .awards > ul > li{ margin-top: 8px; } /*主要內(nèi)容*/ .content{ position: absolute; top: 0; left: 330px; } .content > div{ margin-top: 15px; margin-left: 15px; } .content > div > h3{ margin-top: 20px; margin-bottom: 15px; color: brown; font-weight: 500; } .education > div{ margin-bottom: 10px; } .education .para{ font-size: 18px; font-family: monospace; } .education .para > i,span{ font-size: 12px; margin-left: 10px; } .jobExp > div > p,ol{ margin-bottom: 10px; font-size: 20px; font-family: monospace; } .jobExp > div > ol{ margin-left: 30px; } </style></head><body> <!-- Header --> <header> <img src="./avatar.jpg"> <nav> <h1>X X X</h1> <h2>個(gè)人簡(jiǎn)歷</h2> <h4><strong>求職意向:</strong> 前端開發(fā)</h4> </nav> </div> </header> <!-- Content --> <section> <!-- SideBar --> <div class="sideBar"> <div class="personalInfo"> <h3>個(gè)人信息</h3> <ul> <li>民族: 漢族</li> <li>政治面貌: 黨員</li> <li>籍貫: XX</li> <li>電話: 12345678910</li> <li>郵箱: 123456@163.com</li> </ul> </div> <div class="selfEva"> <h3>個(gè)人介紹</h3> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos cumque dolores minus eaque voluptas est mollitia? Quaerat earum, eaque tenetur voluptates nisi omnis nihil iste, neque magnam accusantium itaque minus? </p> </div> <div class="awards"> <h3>在校經(jīng)歷</h3> <ul> <li>2015-04 aaaaaa</li> <li>2014-04 aaaaaa二等獎(jiǎng)學(xué)金</li> <li>2014-04 bbbbbbbb</li> <li>2013-01至2015-06 cccccccccc <p>xxxxxxxxxxxxxxxxxxxxxxxxx</p> </li> </ul> </div> <div class="skill"></div> </div> <!-- MainContents --> <div class="content"> <div class="education"> <h3>教育背景</h3> <div> <p class="para">xxx <span>2016-09至2018-06</span></p> </div> <div> <p class="para">xxxxxxx.本科<i>211</i><span>2012-09至2016-06</span></p> <p class="para">xxxxxx xxxx專業(yè)</p> <p class="para subject">xxxx、xxxx、xxxx、xxxx、xxxx</p> <p class="subjects"></p> </div> </div> <div class="jobExp"> <h3>項(xiàng)目經(jīng)歷</h3> <div> <p>獨(dú)立完成xxx網(wǎng)站的搭建和維護(hù)</p> <ol> <li>購(gòu)買阿里云CentOS服務(wù)器</li> <li>安裝LAMP,配置開發(fā)環(huán)境,DNS</li> <li>編寫PHP后臺(tái)代碼,JS/HTML/CSS前端,操作MySQL</li> <li>獨(dú)立上線部署,并維護(hù)系統(tǒng)</li> </ol> <p>使用技術(shù)點(diǎn):<br> CentOS,VI,PHP,Apache,MySQL,HTML/JS/CSS <br> xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx </p> </div> </div> <div class="skill"> <h3>專業(yè)技能</h3> <div> <p>html+css</p> <progress value="50" max="100"></progress> <p>javascript</p> <progress value="50" max="100"></progress> <p>php</p> <progress value="50" max="100"></progress> <p>linux</p> <progress value="40" max="100"></progress> </div> </div> </div> </section></body></html>
關(guān)鍵詞:簡(jiǎn)歷
客戶&案例
營(yíng)銷資訊
關(guān)于我們
客戶&案例
營(yíng)銷資訊
關(guān)于我們
微信公眾號(hào)
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。