ul与li的相对位置问题

ccMuuaigg 2011-03-24 08:55:29

我的代码如下，ul内的Li设置的margin与padding均为0，但显示出来li却在ul内偏右，搞不清为什么



<HTML>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<style type="text/css">

    #LeftMenu

{

	float:left;

	width:200px;

	height:500px;

	background-color:#F3F3F3;

}



#LeftMenu h3 {

	height:35px;

	width:200px;

	font-weight:600;

	background-color:#8096B6;

	text-align:left;

	text-indent:20px;

	padding-top:10px;

	margin:0;

}



#LeftMenu ul

{

	width:200px;

	margin-left:0px;

	background-color:blue;

}



#LeftMenu ul li 

{

	display:block;

}



#LeftMenu ul li 

{

	/*list-style:none;*/

	height:30px;

	width:200px;

	text-align:left;

	margin:0;

	list-style-type:disc;

	background-color:Maroon;

}



#LeftMenu ul li a

{

	color: #000000;

	font-family: Verdana;

	font-size: 10px;

	text-decoration:underline;

}



#LeftMenu ul li a:hover,#LeftMenu ul li a:active

{

	color: #ff9900;

	font-size: 12px;

	font-weight:bold;

	text-decoration:none;

	list-style-image:URL(pic/Select.jpg);

	list-style-type:square;

}

</style>

</head>

<body>

    <div id="LeftMenu">

    <h3>About CIST</h3>

    <ul>

    	<li>

    	    <a href="#">Message from the President</a>

    	</li>

    	<li>

    	    <a href="#">Introduction</a>

    	</li>

    	<li>

    	    <a href="#">Motto</a>

    	</li>

    	<li>

    	    <a href="#">Cares and Supports from Leaders</a>

    	</li>

    	<li>

    	    <a href="#">Secretaries of CPC and President</a>

    	</li>

    	<li>

    	    <a href="#">Evolution of CIST</a>

    	</li>

    	<li>

    	    <a href="#">Infrastructure Construction</a>

    	</li>

    	<li>

    	    <a href="#">CIST's Future</a>

    	</li>

    </ul>

    </div>

</body>

</html>

...全文

251 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

hongmei85 2011-03-24

打赏
举报

<HTML>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<style type="text/css">

    #LeftMenu

{

    float:left;

    width:200px;

    height:500px;

    background-color:#F3F3F3;

}



#LeftMenu h3 {

    height:35px;

    width:200px;

    font-weight:600;

    background-color:#8096B6;

    text-align:left;

    text-indent:20px;

    padding-top:10px;

    margin:0;

}



#LeftMenu ul

{

    width:200px;

    margin-left:0px;

    background-color:blue;

		padding:0px;

}



#LeftMenu ul li 

{

    display:block;

}



#LeftMenu ul li 

{

    /*list-style:none;*/

    height:30px;

    width:200px;

    text-align:left;

    margin:0;

    list-style-type:disc;

    background-color:Maroon;

}



#LeftMenu ul li a

{

    color: #000000;

    font-family: Verdana;

    font-size: 10px;

    text-decoration:underline;

}



#LeftMenu ul li a:hover,#LeftMenu ul li a:active

{

    color: #ff9900;

    font-size: 12px;

    font-weight:bold;

    text-decoration:none;

    list-style-image:URL(pic/Select.jpg);

    list-style-type:square;

}

</style>

</head>

<body>

    <div id="LeftMenu">

    <h3>About CIST</h3>

    <ul>

        <li>

            <a href="#">Message from the President</a>

        </li>

        <li>

            <a href="#">Introduction</a>

        </li>

        <li>

            <a href="#">Motto</a>

        </li>

        <li>

            <a href="#">Cares and Supports from Leaders</a>

        </li>

        <li>

            <a href="#">Secretaries of CPC and President</a>

        </li>

        <li>

            <a href="#">Evolution of CIST</a>

        </li>

        <li>

            <a href="#">Infrastructure Construction</a>

        </li>

        <li>

            <a href="#">CIST's Future</a>

        </li>

    </ul>

    </div>

</body>

</html>