2016-12-28 229 views
1

我如何擺脫md芯片的下劃線 - 131,132和T下的線?如何刪除下劃線我md芯片在佈局=行

代碼

<div layout="row"> 
    <div flex> 
    <md-chips ng-model="condition.list" readonly="true" md-removable="false"> 
     <md-chip-template> 
     <span>{{$chip.id}}</span> 
     </md-chip-template>     
    </md-chips> 
    </div> 
</div> 

貌似這個 enter image description here

回答

6

下劃線,因爲<md-chips>添加邊框底部。 您可以通過如下設置刪除該行

.md-chips{ 
    box-shadow: 0 0px !important; 
} 

var app = angular.module("app", ['ngMaterial']); 
 
app.controller("myCtrl", function($scope) {});
.md-chips{ 
 
    box-shadow: 0 0px !important; 
 
}
<script src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js'></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular-route.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular-animate.min.js"></script> 
 
<script src='https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.1.1/angular-material.min.js'></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular-aria.min.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.1.1/angular-material.min.css" rel="stylesheet" /> 
 
<div layout="row" ng-app="app" ng-controller="myCtrl"> 
 
    <div flex> 
 
    <md-chips> 
 
     <md-chip-template> 
 
     <span>{{chip.id}}</span> 
 
     </md-chip-template> 
 
    </md-chips> 
 
    </div> 
 
</div>

+0

如果範圍是這樣的:'MD-芯片.MD-芯片{...}'那麼它會覆蓋材料的風格,你不會需要'!重要'。此外,'box-shadow:none;'可能更直截了當...... – ctb