1

我有一个导航菜单，其中li彼此非常接近。如何增加margin-left菜单之间的距离。我试过了，.main_menu li但它不工作。以及如何添加selected到菜单中。即单击菜单时，它应该具有类似于:hover（黑色背景和蓝色文本）的属性

这是一个小提琴： 小提琴

4

5 回答 5

3

更改display:inline并在课堂内display:inline-block添加margin-left您想要的内容.main_menu li 试试这个：

.main_menu li {
    display:inline-block;
    padding-left:1px;
    font:bold;
    margin-left:10px;
}

演示

于 2013-09-22T17:38:59.623 回答
2

添加margin-left到a而不是li：DEMO

于 2013-09-22T17:39:19.210 回答
1

看到这个小提琴

使用inline-block而不是inline.

.main_menu li
{
    display:inline-block;
    padding-left:1px;
    margin-left: 2px;
    font:bold;
}

内联元素没有“盒子”布局，因此边距不适用。但是块元素（或内联块元素）可以。

于 2013-09-22T17:38:41.027 回答
0

将您的显示类型更改为inline-block，然后边距属性将起作用。

.main_menu li {
display:inline-block;
padding-left:1px;
font:bold;
margin-left:10px;
}

http://jsfiddle.net/5s2mQ/14/

于 2013-09-22T17:40:01.350 回答
0

添加到a会做的伎俩。可能你也想对齐它。

/* the margin part so the buttons won't touch eachother */
margin-left: 10px;
margin-top: 2px; /* optional, you only asked for the left */
/* to align: */
width: 18%;
float: left

http://jsfiddle.net/5s2mQ/24/

于 2013-09-22T17:43:48.970 回答