61,126
社区成员
发帖
与我相关
我的任务
分享急急急。关于对齐问题。
CSS:
.Menu{
float:left;
margin-right:4px;
margin-top:1px;
overflow:hidden;
cursor:pointer;
height:27px;
width:116px;
text-align:center;
}
这是HTML代码部分：
<div class="Menu"><img src="images/toolbar/1.png"/><a class="toobarA">Applitions</a></div>
显示是左边一个图标，右边一排字，图标是居中了，但字没居中，怎么解决？字总相对于图标的位置靠下，两个是一行的。
.Menu{
float:left;
margin-right:4px;
margin-top:1px;
overflow:hidden;
cursor:pointer;
height:27px;
width:116px;
text-align:center;
}
这是HTML代码部分：
<div class="Menu"><img src="images/toolbar/1.png"/><a class="toobarA">Applitions</a></div>
显示是左边一个图标，右边一排字，图标是居中了，但字没居中，怎么解决？字总相对于图标的位置靠下，两个是一行的。
...全文
请发表友善的回复…
发表回复
Beingchou 2008-11-11
- 打赏
- 举报
不行的啊。用了padding就只显示IMG了。我想IMG在左边，文字在右边，放在一个<a/>标签里。现在是图标和文字对不其。我想文字的行高在图标中间的位置，和操作系统的图标一样，一个图标一个标题，对其的。
sharpblade 2008-11-11
- 打赏
- 举报
图片做成背景图片
Cyril_Tam 2008-11-11
- 打赏
- 举报
从你代码上看, 你应该是想做一个左边的menu,对吗
如果是menu的话, 基本上每一项的样式都一样, 所以可以统一设置, 为了使网站更美观, 一般menu都尽量统一,要么就一行文字, 要行就两行文字, 所以避免不了有些一行有些两行的话, 那就可以单独设置一行的, 两行的padding也行...
如果是menu的话, 基本上每一项的样式都一样, 所以可以统一设置, 为了使网站更美观, 一般menu都尽量统一,要么就一行文字, 要行就两行文字, 所以避免不了有些一行有些两行的话, 那就可以单独设置一行的, 两行的padding也行...
Cyril_Tam 2008-11-11
- 打赏
- 举报
用padding来调整吧
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
.Menu{
float:left;
margin-right:4px;
margin-top:1px;
overflow:hidden;
cursor:pointer;
height:27px;
width:116px;
text-align:center;
}
</style>
</head>
<body >
<div class="Menu">
<div id="images" style="float:left "><img src="images/toolbar/1.png"/></div>
<div id="content" style="float:left; padding-top:10px;"><a class="toobarA">Applitions </a></div>
</div>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
.Menu{
float:left;
margin-right:4px;
margin-top:1px;
overflow:hidden;
cursor:pointer;
height:27px;
width:116px;
text-align:center;
}
</style>
</head>
<body >
<div class="Menu">
<div id="images" style="float:left "><img src="images/toolbar/1.png"/></div>
<div id="content" style="float:left; padding-top:10px;"><a class="toobarA">Applitions </a></div>
</div>
</body>
</html>
Beingchou 2008-11-11
- 打赏
- 举报
不行。。。IE可以。。。火狐下不能显示。。。
Beingchou 2008-11-11
- 打赏
- 举报
谢谢啦~OK啦。
lkq_net 2008-11-11
- 打赏
- 举报
<div class="Menu"> <img style="float:left;" src="1.png"/> <a style="float:left;margin:30px 0px ;" >Applitions </a> </div>
后边的margin：30px 0px 的具体值尝试着来....
后边的margin：30px 0px 的具体值尝试着来....
lkq_net 2008-11-11
- 打赏
- 举报
<div class="Menu"> <img style="float:left;" src="1.png"/> <a style="float:left;margin:30px 0px ;" >Applitions </a> </div>Cyril_Tam 2008-11-11
- 打赏
- 举报
用DIV垂直居中是比较麻烦的
做成图片吧~
做成图片吧~
