Question

我在这里和＃34;推文＆＃34;的左上角有一个演示application。有点，我不知道它们来自哪里。代码用Ember编写，模板看起来像这样

 <h2>Ember.js DEMO Tweet list</h2>

        <div class="tweets-list">
        <h2>Tweets</h2>
<button {{action 'changeAllTweets'}}>Change All Tweets</button>
<button {{action 'changeOneTweet'}}>Change One Tweet</button>
<div class="row input-wrap">
</div>
        {{#each this.model.topTweets as |model|}}
            <li class="media">
<div {{action 'bindNewModel' this}} class="row">
  <a class="pull-left" href="#"><img class="media-object" width="75" height="75" src={{model.avatar}}/></a>
  <div class="media-body">
  <h4 class="media-heading">{{model.favorites}}</h4>
  <p>{{model.text}}</p>
        </div>
</div>
<div class="row">
<div class="col-xs-4">
<a href="#">Expand</a>
        </div>
<div class="col-xs-8">
<ul class="list-inline text-right">
<li href="#">Reply</li>
<li href="#">Retweet</li>
<li href="#">Favorite</li>
<li href="#">More</li>
        </ul>
        </div>
        </div>

</li>
{{/each}}

                </div>

P.S。必须按下SHOW LIST按钮才能显示列表

Answer 1

这些是列表项标记。添加list-style：none;到了ul，它们就会消失。编辑：我看到你也错过了ul本身。包裹ul不存在。这些只是列表项。在每个语句之前添加开头ul并在之后关闭它。如果列表样式无规则。我在移动设备上，无法编辑小提琴。

Answer 2

这是因为您正在使用列表项，即<li>标记。默认情况下，它们会带有子弹点。

首先，您应该只在有序或无序列表（<li> / <ol>）中使用<ul>标记。您应该考虑列表项是否合适。也许<div>更合适？如果要使用列表项，则应将它们包装在<ul>列表中，然后通过应用样式来清除项目符号：list-style-type: none。
更改列表项的display样式也将消除掉点。

Answer 3

存在HTML结构错误。使用<li class="media">标记包裹<ul>。我可以假设你正在使用Bootstrap。如果是，则将<li>标记与<ul class="list-group">一起打包，并将list-group-item类添加到<li>标记，如下所示：<li class="media list-group-item">

未知的点呈现到页面 - 是什么原因造成的？

3 个答案: