一、html文件
<html>
<head>
<meta charset="UTF-8">
<title>臥龍控股</title>
<link rel="stylesheet" type="text/css" href="css/zuoye.css"/>
</head>
<body>
<div id="div1">
<img src="img/logo.JPG" />
<form>
<input type="text" name="" id="" value="" />
<input type="submit" value="搜索"/>
</form>
</div>
<div id="div2">
<table>
<tr>
<td>集團項目</td>
<td>產(chǎn)品中心</td>
<td>臥龍市場</td>
<td>技術(shù)研發(fā)</td>
<td>國際合作</td>
<td>投資者關(guān)系</td>
<td>新聞資訊</td>
<td>人力資源</td>
</tr>
</table>
<img src="img/02.jpg"/>
</div>
<div id="div3">
<div id="a">
<h4>公司簡介</h4>
<p>臥龍控股集團有限公司創(chuàng)建于1984年，經(jīng)過20多年的發(fā)展，集團現(xiàn)擁有2家上市公司（30家控股子公司、員工7000余人、總資產(chǎn)70億元，主要經(jīng)營制造業(yè)、房地產(chǎn)業(yè)、商貿(mào)金融投資業(yè)三大產(chǎn)業(yè)。</p>
</div>
<div id="b">
<h4>公司目標(biāo)</h4>
<p>臥龍正按照集團“十一五”發(fā)展規(guī)劃，加快實現(xiàn)“三步走”發(fā)展戰(zhàn)略，努力實現(xiàn)資產(chǎn)規(guī)模與銷售規(guī)?！半p百億”目標(biāo)，基本建成市場國際化、資本多元化、管理現(xiàn)代化的高科技、高成長、高效益的大型企業(yè)集團。</p>
</div>
<div id="c">
<h4>商標(biāo)含義</h4>
<p>標(biāo)志造型由英文"wolong"組成.形成一條昂首的巨龍,給人一種運籌帷幄、蓄勢待發(fā)之勢，象征臥龍實力雄厚、發(fā)展迅猛、卓越領(lǐng)先。</p>
</div>
</div>
<div id="div4">
<h4>臥龍市場</h4>
</div>
<div id="d">
<img src="img/03.jpg"/>
<img src="img/04.jpg"/>
<img src="img/05.jpg"/>
<img src="img/06.jpg"/>
</div>
<div id="div5">
<div id="a1">
<h4>產(chǎn)品中心</h4>
<hr />
<ul>
<li>汽車電機</li>
<li>日用電機</li>
<li>特種電機</li>
<li>大功率電機</li>
<li>電工設(shè)備</li>
</ul>
<ul>
<li>工業(yè)驅(qū)動和自動化</li>
<li>高壓變頻和系統(tǒng)集成</li>
<li>混泥土攪拌機</li>
<li>電動車輛</li>
</ul>
<ul>
<li>電池電源</li>
<li>輸變電設(shè)備</li>
<li>樓盤信息</li>
<li>金融信息</li>
</ul>
</div>
<div id="a2">
<h4>技術(shù)研發(fā)</h4>
<hr />
<ul>
<li>科技力量</li>
<li>現(xiàn)金設(shè)備</li>
<li>研發(fā)創(chuàng)新</li>
<li>工藝流程</li>
</ul>
</div>
</div>
<div id="div6">
<p>Copyrights ? 2013 臥龍控股集團 | 版權(quán)所有 </p>
</div>
</body>
</html>
二、css樣式
body{
margin: auto;
width: 800px;
height: 600px;
}
#div1{
width: 100%;
height:50px;
margin: auto;
}
#div1 img{
float: left;
}
#div1 form{
padding-top: 20px;
float: right;
}
#div2{
width: 100%;
height:400px;
}
#div2 table{
width: 100%;
height: 60px;
background-color: #000000;
color: #DDDDDD;
font-size: 18px;
text-align: center;
}
#div2 img{
width: 100%;
height: 360px;
}
#div3{
width: 100%;
height: 230px;
margin: 20px;
}
#a{
height: 230px;
width: 30%;
float: left;
margin-right: 20px;
}
#b{
height: 230px;
width: 30%;
float: left;
margin-right: 20px;
}
#c{
height: 230px;
width: 30%;
float: left;
}
#div4{
width: 100%;
height: 50px;
margin:20px;
}
#d{
width: 100%;
height: 100px;
}
#d img{
width: 20%;
height: 100%;
margin:20px;
float:left
}
#div5{
width: 100%;
height: 180px;
margin: 20px;
float: left;
}
#div5 ul{
float: left;
margin-right: 10px;
}
#a1{
width:60%;
margin: 10px;
float: left;
}
#a2{
width: 20%;
float: right;
margin: 10px;
margin-right: 80px;
}
#div6{
/*width:100%;*/
margin-top:30px;
height:20px;
float:right;
}
三、效果
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。
