html 实战制作页脚的实例

由 hrs 提交于 2019/12/20 - 21:46 , 周五

实例代码：

<!doctype html>
<head>
<meta charset="utf-8">
<style type="text/css">

.n2{
width:150px;
height:180px;
background-color:#181818;
color:#ffffff;
float:left;
}

.n3{
margin:15px;
font-weight:bold;
text-align:center;
}

.n4{
width:748px;
clear:both;
background-color:#000000;
color:#ffffff;
height:50px;
text-align:right;
padding:1px;

}

</style>
</head>
<html>
<div class="n1">
	<div class="n2">
		<dl>
				<dd class="n3">走进千锋</dd>
				
				<dd>千锋简介</dd>
				<dd>千锋之路</dd>
				<dd>联系我们</dd>
				
				
			</dl>
		</div>
		
	<div class="n2">
			<dl>
				<dd class="n3">人才服务</dd>
				
				<dd>企业联盟</dd>
				<dd>企业招聘</dd>
				<dd>优秀人才</dd>
				<dd>名企双选会</dd>
				
			</dl>
		</div>
		
		<div class="n2">
<dl>
			<dd class="n3">千锋教育</dd>
			
			<dd>IOS培训</dd>
			<dd>Android培训</dd>
			<dd>HTML5培训</dd>
		    <dd>UI培训</dd>
		</dl>
		</div>
		
		<div class="n2">
<dl>
			<dd class="n3">App 外包</dd>
			
			<dd>业务范围</dd>
			<dd>案例展示</dd>
			<dd>项目优势</dd>
			<dd>合作方式</dd>
			
		</dl>
		</div>
		
		<div class="n2">
			<dl>
			<dd class="n3">培训服务</dd>
			
			<dd>企业内训</dd>
			<dd>师资培训</dd>
			
		</dl>
		</div>
		<div class="n4">
		<p> Copyright © 2009 - 2019 版权所有  北京千锋互联科技有限公司 京备：1200031251</p>
		</div>

</div>
</html>

运行效果：

aac.png

标签