Как удалить цвет по умолчанию в типе ввода?

Question

Я создал тип ввода и создал границу границы для этого поля, но когда я нажал эту кнопку, он отобразил цвет по умолчанию, но я не должен отображать цвет по умолчанию . Ниже приведено изображение:

Ниже мой HTML-код:

<ion-item class="Credit"> 
<ion-input type="number" 
      placeholder="Credit Card number" 
      class="form-control"></ion-input> 
</ion-item> 

Ниже мой CSS код:

.Credit{ 
     top: 20px; 
     border-radius: 10px; 
     width: 350px; 
     display: block; 
     margin-left: auto; 
     margin-right: auto; 
     background: url(../assets/images/credit_card.png); 
     background-position:right; 
     background-size: 45px; 
     background-repeat:no-repeat; 
     border:1px solid #DADADA; 
     margin-bottom: 10px; 


} 

Answer 1

Вы можете попробовать с помощью переопределения правил ионическом стиле, потому что то же самое произойдет и когда вход действительным или недействительным:

/* Workaround to hide android default validation colors */ 
ion-item.item-md.item-input.input-has-focus .item-inner, 
ion-item.item-md.item-input.ng-valid.input-has-value:not(.input-has-focus) .item-inner, 
ion-item.item-md.item-input.ng-invalid.ng-touched:not(.input-has-focus) .item-inner { 
    border-bottom-color: #dadada; 
    box-shadow: none; 
} 

/* Workaround to hide window phone default validation colors */ 
ion-item.item-wp.item-input.input-has-focus .text-input, 
ion-item.item-wp.item-input.ng-valid.input-has-value:not(.input-has-focus) .text-input, 
ion-item.item-wp.item-input.ng-invalid.ng-touched:not(.input-has-focus) .text-input { 
    border: 2px solid #dadada; 
} 

UPDATE

A Ионный способ, чтобы решить эту проблему, добавив следующее в variables.scss файла:

// Ionic variables override 
$text-input-ios-show-focus-highlight: false; 
$text-input-md-show-focus-highlight: false; 
$text-input-wp-show-focus-highlight: false; 

Answer 2

Попробуйте .Credit:focus{outline: none;}

Answer 3

Просто добавьте еще одну строку CSS

.Credit:FOCUS{ 
color: #DADADA; 
}