老师请检查
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>ÎÞ±êÌâÎĵµ</title>
<!--根据效果图,写出代码,实现导航条在页面中无论是水平方向还是垂直方向都居中显示。样式要求:(1) 导航在左,导航项在右(2) 导航logo和导航项都有鼠标点击效果(3) 导航项水平和垂直方向都居中显示,每个导航项之间的距离一样。
-->
<style>
* {margin:0; padding:0;}
.nav {
width:1100px;
height:100px;
background:#333;
position:absolute;
top:50%;
margin-top:-50px;
left:50%;
margin-left:-550px;
}
.pic {
width:300px;
height:100px;
background:url(http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png) no-repeat;
float:left;
/* clear:left;*/
}
.text ul {
float:right;
list-style:none;
color:#fff;
font: bold 18px 'Microsoft YaHei';
padding-right:20px;
}
.text ul li {
float:left;
height:100px;
line-height:100px;
margin:0 20px;
}
</style>
</head>
<body>
<div class="nav">
<div class="pic"></div>
<div class="text">
<ul>
<li>课程</li>
<li>职业路径</li>
<li>实战</li>
<li>原文</li>
<li>手记</li>
</ul>
</div>
</div>
</body>
</html>
顺便问下logo图片如果不用ps改变大小的话,用css样式可不可以把图片的左右黑色位置给消除




恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星