html如何添加水平边距,css – 为水平列表中的单个列表项添加边距

是否可以在水平无序列表中的某个项的顶部添加边距？

我已经制作了一个以云为主题的导航栏,但我并不希望所有的云都是一条直线,所以我试图让它们不是一条直线.

这些答案都没有对我有用,它根本不会改变列表项,所以我在这里添加了一些代码：

• 
• 
• 
• 

CSS：

body{

background-image: -webkit-gradient(

linear,

left bottom,

left top,

color-stop(0, rgb(94,132,19)),

color-stop(0.6, rgb(124,180,34)),

color-stop(0.6, rgb(252,253,255)),

color-stop(1, rgb(117,178,209))

);

background-image: -moz-linear-gradient(

center bottom,

rgb(94,132,19) 0%,

rgb(124,180,34) 60%,

rgb(252,253,255) 60%,

rgb(117,178,209) 100%

);

min-height: 500px;

text-align: center;

background-position: absolute;

}

#sun{

height: 72px;

width: 72px;

float: right;

background-image: url('sun.png');

}

/*---NAVIGATION---*/

#home img:hover{

background-image: url('buttons/home.png');

}

#info img:hover{

background-image: url('buttons/info.png');

}

#designs img:hover{

background-image: url('buttons/designs.png');

}

#contact img:hover{

background-image: url('buttons/contact.png');

}

#clouds ul, li{

display: inline;

margin: 40px;

}

#clouds ul{

display: inline;

}

/*---NAVIGATION END---*/

#wrap h1{

margin-top: 175px;

font-family: code bold;

color: white;

text-align: center;

text-shadow: 2px 2px 5px #000;

}

#wrap{

font-family: code bold;

color: white;

text-shadow: 2px 2px 5px #000;

width: 500px;

text-align: center;

margin: 0 auto;

}

#text{

font-family: kartika;

font-size: 22;

-moz-column-count: 2;

-moz-column-gap: 3em;

-moz-column-rule: 1px dashed fff;

-webkit-column-count: 2;

-webkit-column-gap: 3em;

-webkit-column-rule: 1px dashed fff;

}

我已经决定添加我的整个样式表,因为可能会出现错误,导致列表项边距不起作用,尽管我似乎找不到任何问题.

感谢目前为止的答案和评论.

似乎改变单个项目的边距只有在列表具有浮动时才有效：离开它,是否可以将列表居中而不是将其浮动到左边以使其工作？