Développement PHP de tutoriel de site Web d'entreprise front-end (2)
Nous avons terminé d'écrire la mise en page et le style de la page d'accueil dans la dernière section, en regardant quelques images, nous pouvons déjà constater que seul le contenu de la partie centrale est le même, la partie en-tête et la partie centrale. La partie terrestre est la même,
Jetons un coup d'?il au code suivant pour la page "à propos de nous". Le code est le suivant?:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<title>關(guān)于我們</title>
<style type="text/css">
*{margin:0px;padding:0px;}
/*頭部樣式*/
#top{width:410px;height:40px;margin:0 auto;}
body{background:#f0f0f0;}
#to_left{float:left;}
#top_right{float:right;margin-top:20px;margin-right:15px;}
li{float:left;list-style:none;margin:0px 5px; padding-bottom:15px;}
li a{text-decoration:none;color:#000;}
li a:hover{color:red;}
#cnt{width:410px;margin:0 auto;}
/*about 部分樣式*/
.dv{width:410px;border:1px solid #ccc;margin:0 auto;margin-top:30px;}
.dv1{width:90px;height:50px;margin:0 auto;line-height:50px;background:#f0f0f0;
text-align:center;margin-top:-28px;font-weight:bold;}
#about{float:left;width:410px;clear:both;}
.about_cnt{width:410px;height:400px;margin:0 auto;}
.about_cnt_left{width:120px;height:300px;padding-top:10px;float:left;}
.img{width:100px;height:70px;border:1px solid #999;margin-top:25px;margin-left:4px;}
.img:first-child{margin-top:5px;}
.about_cnt_right{width:280px;height:300px;float:right;margin-top:1px;margin-right:5px;}
.title{width:100%;height:30px;margin-top:6px;margin-left:5px;font-weight:bold;}
.cont{text-indent:2em;line-height:25px;}
/*底部樣式*/
.but{width:410px;height:65px;margin:0 auto;text-align:center;background:#999;
padding-top:8px;margin-top:5px;}
</style>
</head>
<body>
<div id="top">
<div id="top_right">
<ul>
<li><a href="index.php">首頁</a></li>
<li><a href="about.php">關(guān)于我們</a></li>
<li><a href="news.php">新聞資訊</a></li>
<li><a href="product.php">產(chǎn)品展示</a></li>
<li><a href="contact.php">聯(lián)系我們</a></li>
</ul>
</div>
<div id="top_left"><img src="/upload/course/000/000/010/582407c034cfe355.jpg" width="50" height="50"></div>
</div>
<div id="cnt">
<img src="/upload/course/000/000/010/5824078a8353f806.jpg" width="410px" height="100">
</div>
<div class="dv"></div>
<div class="dv1">關(guān)于我們</div>
<div id="about"></div>
<div class="about_cnt">
<div class="about_cnt_left">
<div class="img"><img src="/upload/course/000/000/010/58240805c0a89281.png" width="100" height="70"></div>
<div class="img"><img src="/upload/course/000/000/010/5824081d79e44593.png" width="100" height="70"></div>
<div class="img"><img src="/upload/course/000/000/010/58240831e90de355.png" width="100" height="70"></div>
<div class="img"><img src="/upload/course/000/000/010/582408418514e905.png" width="100" height="70"></div>
</div>
<div class="about_cnt_right">
<div class="title">當(dāng)前位置>>關(guān)于我們</div>
<div class="cont"> 航天神潔（北京）環(huán)?？萍加邢薰臼怯芍袊教煜到y(tǒng)科學(xué)與工程研究院、中國航天空氣動(dòng)力技術(shù)研究院、航天投資控股股份有限公司和中景恒基集團(tuán)共同投資組建。
公司定位于電弧等離子體技術(shù)在民用產(chǎn)業(yè)中的應(yīng)用與推廣，大力推動(dòng)電弧等離子體技術(shù)在電力、環(huán)保、冶金、航空航天和新材料等領(lǐng)域的應(yīng)用。公司核心技術(shù)來源于中國航天空氣動(dòng)力技術(shù)研究院五十多年的電弧等離子體應(yīng)用技術(shù)的積累，具備原始創(chuàng)新能力，擁有完全自主知識(shí)產(chǎn)權(quán)的全系列電弧等離子體噴槍產(chǎn)品，突破、創(chuàng)新多項(xiàng)國內(nèi)、國際先進(jìn)技術(shù)。。</div>
</div>
</div>
<div class="but">地址：安徽省合肥市科學(xué)大道669號(hào)(黃山路與科學(xué)大道交口東南角) 預(yù)約電話：400-800-9558
備ICP 皖0219845號(hào) <p>版權(quán)所有：合肥環(huán)?？萍?nbsp;All rights reserved</p>
</div>
</body>
</html>Le code ci-dessus concerne la section à propos de nous.
