標籤:padding amp type 0.00 closed lap png imp 開發
html
<div class="acc_item" id="acc_set"> <div class="row bg_fff border_top"> <div class="inner_item border_right col-50"> <div class="con set item" ng-click="changeState(‘setting‘)"> <div class="ite">設定</div> </div> </div> <div class="inner_item col-50"> <div class="con msg item" ng-click="changeState(‘myMessage‘)"> <div class="ite" ng-if="user.unreadcount == 0 ">我的訊息</div> <div class="ite">我的訊息({{user.unreadcount}})</div> <div class="ite" ng-if="user.unreadcount >99 ">我的訊息(99+)</div> </div> </div> </div> </div>
View Code
<div class="acc_item bg_fff m_t_10" id="acc_item"> <div class="row border_top"> <div class="inner_item border_right col-50"> <div class="con item wallet" ng-click="changeState(‘setting‘)"> <div class="ite2">我的錢包</div> <div class="ite2">0.00 元</div> </div> </div> <div class="inner_item col-50"> <div class="con msg item ct" ng-click="changeState(‘myMessage‘)"> <div class="ite">我的卡券</div> </div> </div> </div> <div class="row border_top"> <div class="inner_item border_right col-50"> <div class="con item order" ng-click="changeState(‘setting‘)"> <div class="ite2">我的訂單</div> <div class="ite2">共 4 筆</div> </div> </div> <div class="inner_item border_right col-50"> <div class="con item bank" ng-click="changeState(‘setting‘)"> <div class="ite2">銀行卡</div> <div class="ite2">共 3 張</div> </div> </div> </div> </div>
View Code
CSS
/* set */#acc_set{ margin-top:-10px;}.acc_item .set { background: url(../img/account/icon_01.png) no-repeat left center; background-size: auto 0.35rem;}.acc_item .msg { background: url(../img/account/icon_02.png) no-repeat left center; background-size: auto 0.35rem;}#acc_set .ite{ margin-top:-0.16rem; text-align:left; font-size: 0.14rem !important; color: #333333 !important;}#acc_set .inner_item{ margin-top:0 !important;}/* item 入口*/#acc_item .con{ display:block;}#acc_item .ite{ margin-top:-0.16rem; text-align:left; font-size: 0.14rem !important; color: #333333 !important;}#acc_item .inner_item .ite2{ margin-top:-0.15rem; text-align:left; font-size: 0.14rem !important; color: #333333 !important;}#acc_item .inner_item .ite2:nth-of-type(2){ font-size:0.13rem !important; color: #999999 !important;}.acc_item .wallet{ background: url(../img/account/icon_03.png) no-repeat left center; background-size: auto 0.35rem;}.order .ite2,.bank .ite2{ margin-top:-0.25rem !important; text-align:left; font-size: 0.14rem !important; color: #333333 !important;}.order .ite2:nth-of-type(2),.bank .ite2:nth-of-type(2){ padding-top:10px; font-size:0.13rem !important; color: #999999 !important;}.acc_item .ct { background: url(../img/account/icon_04.png) no-repeat left center; background-size: auto 0.35rem;}.acc_item .order { background: url(../img/account/icon_009.png) no-repeat left center; background-size: auto 0.35rem; margin-left: 0.10rem;}.acc_item .bank { background: url(../img/account/icon_08.png) no-repeat left center; background-size: auto 0.35rem;}
webApp開發-2列布局