CSS：模糊股利

Question

我有這樣一個div：

<div class="customer"> 
<div [ngSwitch]="accessLevel"> 
<div class="customer" *ngSwitchCase="'ENABLED'"> 
<h2 class="label">Customer</h2><br> 
<span>{{customerData.oldId}}</span><br> 
<span>{{customerData.firstName}}</span><br> 
<span>{{customerData.lastName}}</span><br> 
<span>{{customerData.addressLine1}}</span><br> 
<span>{{customerData.email}}</span> 
</div> 
<div class="customer-blurr" *ngSwitchCase="'DISABLED'"></div> 
<div class="customer-blurr" *ngSwitchDefault></div> 
</div> 
</div> 

和CSS：

.customer{ 
    float: left; 
    width: 27%; 
    height: 350px; 
    box-sizing: border-box; 
    padding: 15px; 
} 
.customer-blurr { 
    color: transparent; 
    text-shadow: 0 0 5px rgba(0,0,0,0.5); 
    background-color: #ccc; 
    float: left; 
    width: 27%; 
    height: 350px; 
    box-sizing: border-box; 
    padding: 15px; 
} 

當條件殘疾人是真的我想我的股利是模糊的，它也適用，但尺寸/大小不同。請參閱附件中的圖片，查看與標籤寬度相關的尺寸。

請幫我這個。

感謝

Answer 1

有這樣

<div class="customer"> 
<div [ngSwitch]="accessLevel"> 
<div class="customer" disabled = "{ return *ngSwitchCase }"> 
<h2 class="label">Customer</h2><br> 
<span>{{customerData.oldId}}</span><br> 
<span>{{customerData.firstName}}</span><br> 
<span>{{customerData.lastName}}</span><br> 
<span>{{customerData.addressLine1}}</span><br> 
<span>{{customerData.email}}</span> 
</div> 
<div class="customer-blurr" *ngSwitchDefault></div> 
</div> 
</div> 

和CSS作爲

.customer{ 
    float: left; 
    width: 27%; 
    height: 350px; 
    box-sizing: border-box; 
    padding: 15px; 
} 
.customer[disabled=disabled] { 
    color: transparent; 
    text-shadow: 0 0 5px rgba(0,0,0,0.5); 
    background-color: #ccc; 
    float: left; 
    width: 27%; 
    height: 350px; 
    box-sizing: border-box; 
    padding: 15px; 
}