2016-06-14 96 views
0

我已经为页面上的登录功能创建了一个输入字段,但是我一直在尝试使用css更改字段中文本的颜色。这可能吗。我尝试了很多路线,但是目前为止似乎没有任何工作。下面是在符号的电子邮件部分的代码。使用css更改输入字段的文本颜色

<input class="form-control ng-class:{'error':dashboard.showFormErrors && !dashboard.signinForm.email.$valid}" 
       data-ng-model="signinController.signin.email" 
       type="email" 
       name="email" 
       id="email" 
       placeholder="Email" 
       ng-minlength="2" 
       ng-maxlength="3" 
       required> 
+0

这将是巨大的,如果你能接受一个答案,如果有的话,解决你的问题,还是让我们知道什么是失踪,所以我们可以找到一个没有 – LGSon

+0

我发布了我在页面底部使用的答案/解决方案。 – NVA

+0

一个答案已经有'focus'作为一个建议,接受,而不是张贴自己的答案使用相同 – LGSon

回答

3

是的,这是可能的。

CSS可以定位“email”类型的输入或者这个唯一的输入。

电子邮件输入元素:

input[type=email]{ 
    color: red; 
} 

或特定ID = “电子邮件”:

#email { 
    color: red; 
} 

这里有一个片段:

input[type=email] { 
 
    color: red; 
 
} 
 
#email2 { 
 
    color: green; 
 
}
<input class="form-control ng-class:{'error':dashboard.showFormErrors && !dashboard.signinForm.email.$valid}" 
 
     data-ng-model="signinController.signin.email" 
 
     type="email" 
 
     name="email" 
 
     id="email" 
 
     placeholder="Email" 
 
     ng-minlength="2" 
 
     ng-maxlength="3" 
 
     required> 
 
<input class="form-control ng-class:{'error':dashboard.showFormErrors && !dashboard.signinForm.email.$valid}" 
 
     data-ng-model="signinController.signin.email" 
 
     type="email" 
 
     name="email" 
 
     id="email2" 
 
     placeholder="Email" 
 
     ng-minlength="2" 
 
     ng-maxlength="3" 
 
     required>

如果这仍然不起作用,您可能不得不使用“!important”属性来覆盖其他CSS设置器。

color: red !important; 
0

创建拥有你想要做的领域变化的CSS类,然后通过纳克级的指令影响类的输入标签。 在你的代码中,语法是错误的,我想..但是这是主意。

2

我认为你可以在你的CSS文件中做到这一点:

#email{ 
    color:red; 
} 

你可以给你选择的颜色。

0

您可以应用以下代码 input {color:red; }

0

确实有可能您可以用CSS更改您输入的文字颜色,并且有很多方法可以取决于您想要达到的效果。

例如,如果你想你的颜色设置为blue并让它始终保持蓝色,你可以使用下面的代码:

#email { 
    color: blue; /* Or color: #0000ff */ 
} 

另外,如果你希望你的选择时,改变文本的颜色输入具有焦点时,您可以使用它代替:

#email:focus { 
    color: blue; /* Or color: #0000ff */ 
} 

你也可以改变你的悬停颜色,但这不是东西的使用非常普遍:

#email:hover { 
    color: blue; /* Or color: #0000ff */ 
} 
0

要更改输入颜色为不同类型的输入使用相应的标签(有/无其伪状态)

input, select, textarea { 
    color: #000; 
} 
input:focus, input:active 

/* etc... */ 

input[type=text] - will only select text fields 
input[type=password] - will only select password fields 
input[type=number] - will only select number fields 
/* etc.. */ 

input[type=text]:focus 
/* etc */ 

对于占位造型

::-webkit-input-placeholder { 
    color: red; 
} 

:-moz-placeholder { /* Firefox 18- */ 
    color: red; 
} 

::-moz-placeholder { /* Firefox 19+ */ 
    color: red; 
} 

:-ms-input-placeholder { 
    color: red; 
} 
0

你的很多建议工作的伟大。这是我用CSS中使用的路线

input, select, textarea{ 
    color: #076000; 
} 

textarea:focus, input:focus { 
    color: #076000; 
} 
相关问题