簡體   English   中英

如何刪除列表中項目之間的空格/陰影

[英]How to remove space/shadow between items in a list

我有一個包含卡片清單的模板:

<div class="list">
<div class="card" ng-repeat="event in eventsSportsDay21">

    <div class="item item-avatar item-icon-right" ng-click="toggleEvent(event)">
        <!--ng-style="{'background-color': event.eventColor }">-->
        <img src={{event.eventIcon}}>
        <i class="icon" ng-class="isEventShown(event) ? 'ion-minus' : 'ion-plus'"></i>
        <h2><b>{{event.eventTitle}}</b></h2>
        <p><b>{{event.eventHour}}</b></p>
    </div>

    <div class="item item-body" ng-hide="!isEventShown(event)">
        <div>
            <!--<img src="/img/alfarero.jpg" width="30%" style="float: left; margin: 0 20px 20px 0;" ng-show="false">-->
            <p ng-bind-html="event.eventText | hrefToJS"></p>
        </div>
        <div>
            <!--<p style="clear: both">-->
            <br/>
            <div>
                <i class="icon ion-map balanced" style="font-size: 25px;"></i>&nbsp;&nbsp;<p ng-bind-html="event.eventPlace | hrefToJS" style="display:inline"></p>

            </div>
             <!--</p>-->
             <!--<div>-->
                <div ng-show="event.eventPhone">
                    <i class="icon ion-information-circled balanced" style="font-size: 25px;"></i>&nbsp;&nbsp;<p ng-bind-html="event.eventPhone | hrefToJS" style="display:inline"></p>
                </div>
             <!--</div>-->

        </div>
    </div>

</div>
</div>

它可以完成它的工作,但我想在視覺上進行一些調整。 首先,我想去除每張卡底部的陰影。 第二,如何消除卡之間的空間? 除了CSS還有其他方法嗎?

這是我得到的:

在此處輸入圖片說明

謝謝!

似乎問題是想要在不需要卡時使用它們。 更改為:

<div class="list">
<div ng-repeat="event in eventsSportsDay21">

提供所需的行為。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM