我在<div>
. 代码如下所示,可在 this fiddle获得。
CSS
@font-face {
font-family:'JustVectorRegular';
font-weight: normal;
font-style: normal;
src: url('fonts/justvector/justvector-webfont.eot');
src: url('fonts/justvector/justvector-webfont.eot?#iefix') format('eot'), url('fonts/justvector/justvector-webfont.woff') format('woff'), url('fonts/justvector/justvector-webfont.ttf') format('truetype'), url('fonts/justvector/justvector-webfont.svg#webfontmuk63VQd') format('svg');
}
.social {
padding:0;
margin:2em 0;
list-style:none;
text-align: center;
}
.social li {
display:inline-block;
padding:0;
margin-bottom: -3px;
}
.social li a {
display:block;
float:left;
margin: 0 .1em .2em 0;
line-height:100%;
text-align:center;
font-family:'JustVectorRegular';
font-size:32px;
padding: 8px 8px 8px 10px;
min-width:27px;
max-height:28px;
color:#444;
border-radius: 4px;
border: 1px solid #ddd;
}
HTML
<ul class="social">
<img src="images/mine/logo.png" style="width: 75px; height: 75px;" />
<i class="icon-remove"></i>
<img src="images/mine/logo.png" style="width: 75px; height: 75px;" />
<i class="icon-remove"></i>
<img src="images/mine/logo.png" style="width: 75px; height: 75px;" />
<i class="icon-remove"></i>
<img src="images/mine/logo.png" style="width: 75px; height: 75px;" />
<i class="icon-remove"></i>
<img src="images/mine/logo.png" style="width: 75px; height: 75px;" />
<i class="icon-remove"></i>
<img src="images/mine/logo.png" style="width: 75px; height: 75px;" />
<i class="icon-remove"></i>
<img src="images/mine/logo.png" style="width: 75px; height: 75px;" />
</ul>
我想通过在每个项目之间添加一个项目符号来将它们分解,但是正如代码描述的那样,它根据屏幕宽度包装了徽标,并且一行末尾的项目符号看起来是错误的。我想让代码在每个徽标之后插入一个项目符号,除了行尾的那个。
这可能吗?我真的被困住了,找不到任何帮助
谢谢 :)
(如果我没有正确使用术语,请道歉 - 对我来说都是新事物)