Ändern der `Eingabefeld'-Farbe in MaterializeCSS

Question

Ich mache eine persönliche Website für den persönlichen Gebrauch, mit MaterializeCSS als Design-Vorlage.

ich mich gefragt, ob ich die grünliche Farbe auf einem Eingabefeld wie dieses

zu einer anderen Farbe, wie Rot ändern könnte.

Ich habe zwei Eingabefelder, ein Feld Benutzername und ein Passwort-Feld, mit dem folgenden Code:

<div class="row"> 
    <form class="col s12" action="?p=SignIn" method="post"> 
     <div class="row"> 
     <div class="input-field col s3"> 
      <input id="UserName" type="text" class="validate white-text" name="UserName"> 
      <label for="UserName">Username</label> 
     </div> 
     </div> 
     <div class="row"> 
     <div class="input-field col s3"> 
      <input id="Password" type="password" class="validate white-text" name="Password"> 
      <label for="Password">Password</label> 
     </div> 
     </div> 

und wie gesagt, ich bin mit MaterializeCSS

Answer 1

Ja, es ist möglich.

Die Farbe wird von CSS angezeigt (oder in diesem Fall in SASS geschrieben).

sah ich diese Datei auf: materialisieren/sass/components/forms/_input-fields.scss Dort haben wir die Variable: $ input-Fokus-Farbe

Sie können die Eingabefarben ändern und andere Variablen in die Datei: materialize/sass/components/_variables.scss

Dann kompilieren Sie es zurück zu css. Das ist es.

Mit freundlichen Grüßen

Answer 2

Versuchen Sie die folgenden CSS,

input, input:focus { 
    background-color: black; 
} 

label{ 
    color: red; 
}