首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何更改文本区域的边框颜色

如何更改文本区域的边框颜色
EN

Stack Overflow用户
提问于 2013-04-23 04:58:48
回答 5查看 406.3K关注 0票数 160

请原谅,这是个愚蠢的问题,但我需要帮助。我想在焦点上改变TEXTAREA的边框颜色。但是我的代码似乎不能正常工作。

请查看fiddle上的代码。

代码语言:javascript
复制
<form name = "myform" method = "post" action="insert.php"  onsubmit="return validateform()" style="width:40%">
    <input type="text" placeholder="Enter Name." name="name" maxlength="300" class="input">
    <input type="email" placeholder="Enter E-mail." name="address" maxlength="300" class="input">
    <textarea placeholder="Enter Message." name="descrip" class="input" ></textarea>    
    <br>
    <input class="button secondary" type=submit name="submit" value="Submit" >
</form>

这是CSS

代码语言:javascript
复制
.input {
    border:0; 
    padding:10px; 
    font-size:1.3em; 
    font-family:"Ubuntu Light","Ubuntu","Ubuntu Mono","Segoe Print","Segoe UI";
    color:#ccc; 
    border:solid 1px #ccc; 
    margin:0 0 20px; 
    width:300px;
    -moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2); 
    -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2); 
    box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px; 
    border-radius: 3px;    
  }

input:focus { 
    outline: none !important;
    border-color: #719ECE;
    box-shadow: 0 0 10px #719ECE;
 }
EN

回答 5

Stack Overflow用户

回答已采纳

发布于 2013-04-23 05:03:07

代码语言:javascript
复制
.input:focus {
    outline: none !important;
    border:1px solid red;
    box-shadow: 0 0 10px #719ECE;
  }
票数 340
EN

Stack Overflow用户

发布于 2020-02-27 07:27:03

如此简单:

代码语言:javascript
复制
 outline-color : green!important;

我的react-boostrap按钮的整个CSS是:

代码语言:javascript
复制
 .custom-btn {
     font-size:1.9em;
     background: #2f5bff;
     border: 2px solid #78e4ff;
     border-radius: 3px;
     padding: 50px 70px;
     outline-color : blue !important;
     text-transform: uppercase;
     user-select: auto;
     -moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
     -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2);
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
 }
票数 9
EN

Stack Overflow用户

发布于 2021-02-03 07:21:14

试试这个,可能会行得通

代码语言:javascript
复制
input{
outline-color: #fff //your color
outline-style: none // it depend on you 
}
票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/16156594

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档