Question

子弹图像必须位于文本的右侧。现在，它默认显示在页面的左侧。我怎么能改变这个？

我有这个CSS：

.landingpage ul{
list-style:none;
margin:0 0 1em 15px;
padding: 0;
list-style-position: inside;

}
.landingpage ul li{
line-height:1.3em;
margin: .25em 0;
padding: 0 0 0 15px;
background:url(../images/star.png) no-repeat 0 4px;
  list-style-type: none;
}
.landingpage li ul{
margin:0 0 0 30px;
list-style:disc;
}
 .landingpage li ul li{
padding-right:0;
background:none;
}

/* Holly Hack to fix ie6 li bg */
/* Hides from IE-mac \*/
* html li{height: 1%;}
/* End hide from IE-mac */

@media print{
.landingpage ul {
list-style:disc;
margin-right:30px;
}
 .landingpage ul li {
padding-right:0px;
background:none;
}
}

这是我的HTML：

<div class="landingpage">
<ul >
<li>מפחד מהמלחמה</li>
</div>

</ul>

Answer 1

您没有项目符号的原因是list-style: none;

从list-style: none;移除.landingpage ul，如果您愿意，可以添加direction: rtl;以使列表显示在屏幕右侧而不是左侧。

.landingpage ul{
    margin:0 0 1em 15px;
    padding: 0;
    list-style-position: inside;
    /* direction: rtl; */
}

<强> JSFiddle Demo

Answer 2

尝试以下css

CSS

li{
direction:rtl;
}
ul{
  list-style-position:inside;
}

DEMO

如何将列表的项目符号移动到文本的右侧？

2 个答案: