感觉自己的代码又臭又长,麻烦老师帮忙看看。

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>网页布局</title>
	<style type="text/css">
    *{
      margin:0;
      padding:0;
      border:0;
      border-spacing: 0;
      border-collapse: collapse; 
    }
    .container{
    	background:black;
    	width:100%;
    	height:100px;
    	margin:0 auto;

    }
    .logo{
    	width: 400px;
    	height: 100px;
    	background:url(http://climg.mukewang.com/58c0d2d900016ce303000100.png) no-repeat center left;
    	cursor: pointer;
    }
   	.nav{
   		width: 700px;
   		height: 100px;
   		line-height: 100px;
   		position: absolute;
   		top: 0;
   		right: 0;
   		text-align: center;
   		}
   	.top_table li, .foot_table li{
   		display: inline;
   		color:white;
   		font-size: 20px;
   		margin: 40px;
   		cursor: pointer;
   		width: 60px;
   		}
   	.foot{
   		background: black center;
   		width:100%;
   		line-height: 100px;
   		height: 100px;
   		position: absolute;
   		bottom: 0;
   		text-align: center;
   		}
   	.banner_pic{
   		width: 100%;
   		height: 750px;
   		line-height: 750px;
   		background:blue;
   	}
   	.fst_col{
   		width: 50%;
   		height: 750px;
   		line-height: 750px;
   		position: absolute;
   		left: 0;

   	}
   	.sec_col{
   		width: 50%;
   		height: 750px;
   		line-height: 750px;
   		position: absolute;
   		right: 0;

   	}
   	.foot_table,.top_table{
   		height: 98px;
   	}
   	h3.title_in_first_col{
   		width: 50%;
   		height:100px;
   		line-height: 100px;
   		position: absolute;
   		top: 0;
   		left: 0;
   		margin-left:200px;
   		margin-top: 80px;
   		font-size: 30px;
   	}
   	h3.title_in_second_col{
   		width: 50%;
   		height:100px;
   		line-height: 100px;
   		position: absolute;
   		top: 0;
   		left: 0;
   		margin-top: 80px;
   		font-size: 30px;
   	}

   	.path_road li{
   		font-size: 20px;
   		height: 50px;
   		width: 300px;
   		list-style: none;
   	}
   	.path_road{
   		position: absolute;
   		left: 200px;
   		top:-150px;
   	}

   	.course li{
   		height: 50px;
   		width: 300px;
   		list-style: none;
   		font-size: 20px;
   	}
   	.course{
   		position: absolute;
   		left: 0;
   		top: -150px;
   	}
   	span{
   		background-color: red;
   	}
	</style>
</head>
<body>
	<!--页头-->
	<div class="container">
		<div class="logo"></div>
		<div class="nav">
			<ul class="top_table">
				<li>课程</li>
				<li>职业路径</li>
				<li>实战</li>
				<li>猿问</li>
				<li>手记</li>
			</ul>
		</div>
	</div>
	<!--主体为两列-->
	<div class="banner_pic">
		<!--第一列-->
		<div class="fst_col">
			<h3 class="title_in_first_col">课程推荐</h3>
			<ul class="path_road">
				<li><span>职业路劲</span>&nbsp;&nbsp;&nbsp;html5与实现动态网页</li>
				<li><span>职业路劲</span>&nbsp;&nbsp;&nbsp;html5与实现动态网页</li>
				<li><span>职业路劲</span>&nbsp;&nbsp;&nbsp;html5与实现动态网页</li>
				<li><span>职业路劲</span>&nbsp;&nbsp;&nbsp;html5与实现动态网页</li>
				<li><span>职业路劲</span>&nbsp;&nbsp;&nbsp;html5与实现动态网页</li>
			</ul>
		</div>
		<!--第二列-->
		<div class="sec_col">
			<h3 class="title_in_second_col">相关课程</h3>
			<ul class="course">
				<li>html5 css3 javascript</li>
				<li>html5 css3 javascript</li>
				<li>移动端基础 移动端app开发</li>
			</ul>
		</div>
	<!--页脚-->
		<div class="foot">
			<ul class="foot_table">
				<li>网站首页</li>
				<li>企业合作</li>
				<li>人才招聘</li>
				<li>联系我们</li>
				<li>常见问题</li>
				<li>友情链接</li>
			</ul>
		</div>
</body>
</html>
我想问的是,为什么这个li标签的2px就是弄不掉,boder取消也不行。最终我只能把ul的高度减小2px。
还有我在chrom浏览器中看了下发现我的职业路劲 html5与动态网页那里一开始就有了个偏移量,就是Li标签中的文字
不在li容器中,为什么啊?


小学生6年级
浏览 976回答 1
1回答
打开App,查看更多内容
随时随地看视频慕课网APP