Javascript 如何突出显示用户名框？

你好，我有问题。。。 我想更改登录表单中的用户名和密码文本框高亮显示颜色。。。 当我点击它时，它被选为正方形 但它不是方形的，而是圆形的 这是我的代码显示我的问题

html:

---

只需在CSS中添加以下代码行，即可解决问题：

input[type=text], /*transition delay*/
textarea {
 -webkit-transition: all 0.35s ease-in-out;
 -moz-transition: all 0.35s ease-in-out;
 -ms-transition: all 0.35s ease-in-out;
 -o-transition: all 0.35s ease-in-out;
 outline: none;
 padding: 3px 0px 3px 3px;
 margin: 5px 1px 3px 0px;
 border: 2px solid #f1f1f1;
}

input[type=text]:focus, /*creates highlight effect*/
textarea:focus {
  box-shadow: 0 0 3px rgba(81, 203, 238, 1);
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid rgba(81, 203, 238, 1);
}

input[type=password], textarea{ /*prevents showing outline border when clicked*/
 outline: 0;
}

---

我认为使用CSS的

focus

属性应该可以：

input:focus {
    border: 1px solid #006600;
}

编辑：

更新：要删除默认大纲（黄色），可以将

大纲

属性设置为

无

：

input {
   outline:none;
}

---

这是

请澄清您的问题。您希望对hightlight应用什么样的更改？它的颜色？使突出显示为圆形或使边框为方形？谢谢，它起作用了，但是有一个问题，它没有焦点属性，而是使一条方形黄线，我需要删除它it@user3516809请参阅更新。这是修改后的代码（来自您自己的代码）：我不太理解您，您能更清楚一点吗？

input:focus {
    border: 1px solid #006600;
}

input {
   outline:none;
}