margin 水平居中 CSS
#sm{margin-left:auto;margin-right:auto;}#smul,#smli{float:left;display:inline;}#smli{...
#sm { margin-left: auto; margin-right: auto;}
#sm ul,#sm li { float:left; display:inline;}
#sm li { background-position:-64px -99px;cursor:pointer; margin:0 1px; font-size:12px; text-align:center; width:62px; overflow:hidden;}
#sm li.active { background-position:0 -99px; font-weight:bold; color:#fff; height:26px; margin-bottom:-6px; position:relative;}
帮忙看看,, 先谢谢!
水平居中不生效 ,, 老是在最左边 , 展开
#sm ul,#sm li { float:left; display:inline;}
#sm li { background-position:-64px -99px;cursor:pointer; margin:0 1px; font-size:12px; text-align:center; width:62px; overflow:hidden;}
#sm li.active { background-position:0 -99px; font-weight:bold; color:#fff; height:26px; margin-bottom:-6px; position:relative;}
帮忙看看,, 先谢谢!
水平居中不生效 ,, 老是在最左边 , 展开
3个回答
展开全部
1、首先新建一个HTML文件，命名为test.html。
2、为了测试出明显的效果，在test.html使用div定义了一个带边框的模块，里面放一个p标签。
3、使用margin设置p标签的左外边距。主要使用margin-left的方法定义左外边距的样式，值越大，距离左边就越大。
4、使用margin设置p标签的右外边距。主要使用margin-right的方法定义右外边距的样式，值越大，距离右边就越大。
5、使用margin设置p标签的上外边距。主要使用margin-top的方法定义上外边距的样式，值越大，距离上边就越大。
6、使用margin设置p标签的下外边距。主要使用margin-bottom的方法定义下外边距的样式，值越大，距离下边就越大。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
Hi
从你提供的代码来看，你是想让id为sm的元素在上一级内水平居中吗？
如果是如我所说：
#sm { margin-left: auto; margin-right: auto;width:64px}
增加一个width:64px
margin:[N]px auto;width:[N]px;才可以导致对应的元素居中，单单用margin-left: auto; margin-right: auto;是没办法居中的
从你提供的代码来看，你是想让id为sm的元素在上一级内水平居中吗？
如果是如我所说：
#sm { margin-left: auto; margin-right: auto;width:64px}
增加一个width:64px
margin:[N]px auto;width:[N]px;才可以导致对应的元素居中，单单用margin-left: auto; margin-right: auto;是没办法居中的
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
下面的代码是我经过调过OK的：
<html>
<head>
<style type="text/css">
#sm {
margin: auto;
width: 400px;
}
#sm ul,#sm li { float:left; display:inline;}
#sm li { background-position:-64px -99px;cursor:pointer; margin:0 1px; font-size:12px; text-align:center; width:62px; overflow:hidden;}
#sm li.active { background-position:0 -99px; font-weight:bold; color:#fff; height:26px; margin-bottom:-6px; position:relative;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div id="sm">
<ul>
<li><a href="index.php">网站首页</a></li>
<li><a href="about.php">公司简介</a></li>
<li><a href="news.php">新闻动态</a></li>
<li><a href="product.php">产品介绍</a></li>
<li><a href="link.php">联系我们</a></li>
</ul>
</div>
</body>
</html>
<html>
<head>
<style type="text/css">
#sm {
margin: auto;
width: 400px;
}
#sm ul,#sm li { float:left; display:inline;}
#sm li { background-position:-64px -99px;cursor:pointer; margin:0 1px; font-size:12px; text-align:center; width:62px; overflow:hidden;}
#sm li.active { background-position:0 -99px; font-weight:bold; color:#fff; height:26px; margin-bottom:-6px; position:relative;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div id="sm">
<ul>
<li><a href="index.php">网站首页</a></li>
<li><a href="about.php">公司简介</a></li>
<li><a href="news.php">新闻动态</a></li>
<li><a href="product.php">产品介绍</a></li>
<li><a href="link.php">联系我们</a></li>
</ul>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
