Java作業 HTML製作個人簡介
阿新 • • 發佈:2019-02-02
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <style type="text/css"> *{ margin: 0; padding: 0; } html,body{ width: 100%; height: 100%; } .header{ width: 100%; height: 30%; background-color: bisque; margin: 0 auto; } .header p{ margin-left: 42%; font-size: 60px; line-height: 200px; } .body{ width: 100%; height: 48.3%; position: relative; } .left_div{ width: 35%; height: 100%; left: 0; position: absolute; background-color: lawngreen; } .mid_div{ width: 30%; height: 100%; left: 35%; position: absolute; background-color: aqua; } .right_div{ width: 35%; height: 100%; left: 65%; position: absolute; background-color: lawngreen; } .panel{ height: 50px; line-height: 50px; text-align: center; font-size: 25px; } .footer{ height: 21.7%; width: 100%; background-color: bisque; } .footer a{ font-size: 35px; line-height: 186px; margin-left: 45%; } </style> </head> <body> <div class="header"> <p>個人簡介</p> </div> <div class="body"> <div class="left_div"> </div> <div class="mid_div"> <div class="panel panel-primary">姓名:李凱</div> <div class="panel panel-primary">年齡:22</div> <div class="panel panel-primary">性別:男</div> <div class="panel panel-primary">家庭住址:四川省眉山市仁壽縣</div> <div class="panel panel-primary">就讀院校:西南石油大學</div> <div class="panel panel-primary">所修專業:軟體工程</div> <div class="panel panel-primary">興趣愛好:足球,乒乓球,旅遊,創業</div> </div> <div class="right_div"> </div> </div> <div class="footer"> <a href="http://www.500d.me/cvresume/5201314/">我的簡歷</a> </div> </body> </html>