HTML Textarea永久边框颜色

时间:2015-07-23 14:40:03

标签: javascript jquery html css twitter-bootstrap

我一直试图将我的textarea PONGANENTLY(不是焦点)的颜色设置为某种颜色..它不起作用......我正在使用bootstrap(我不知道它是否与此有关) )但由于某种原因,我不能永久地设置我的textarea的边框颜色..我在我的CSS中有这个(我已经尝试了其他组合,我已经看到Stack溢出)但它不起作用。

textarea{ 


  width: 650px; 
  min-width:650px; 
  max-width:650px; 

  height:400; 
  min-height:400px;  
  max-height:400px;

  border-color: red;                 /*NOT WORKING*/

}

宽度和高度起作用所以不用担心。

html中的我的textarea看起来像这样:

<table class="table">
    <tr>
    <td><textarea id="task1" class="form-control"></textarea>
    </td>
</tr>

是的,它在一张桌子里,我有几个textareas但仍然(不知道那是不是这个原因,我不这么认为)..

谢谢!

凯文

3 个答案:

答案 0 :(得分:2)

请注意,您有一个用于定义边框的课程.form-control,将!important设置为textarea或在您的CSS中再添加一个课程,并将该课程的规则放在.fom-control是。

选项1

<强> CSS

textarea{ 
  width: 650px; 
  min-width:650px; 
  max-width:650px; 
  height:400; 
  min-height:400px;  
  max-height:400px;
  border:solid 1px orange !important;    
}

选项2

<强> HTML

<table class="table">
    <tr>
    <td><textarea id="task1" class="form-control orange-border"></textarea>
    </td>
</tr>

<强> CSS

.form-control {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
    display: block;
    font-size: 14px;
    height: 34px;
    line-height: 1.42857;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}

.orange-border{ 
border:solid 1px orange;
}

<强> DEMO HERE

答案 1 :(得分:1)

您需要设置:

border: 1px solid red;

border-width: 1px;
border-color: red;
border-style: solid;

答案 2 :(得分:0)

好的,这是一个简单的修复...... 我以ID为目标.. 我说:

#task1{
border-color:red;
}

它有效!