input点击边框颜色改变
时间: 2023-07-05 16:03:33 浏览: 161
可以使用CSS来实现点击边框颜色改变的效果。示例代码如下:
```html
<input type="text" class="input-box">
```
```css
.input-box:focus {
border-color: blue; /* 点击后边框颜色变为蓝色 */
}
```
以上代码中,当输入框被点击时,它的边框颜色会变成蓝色。你可以根据需要修改蓝色为其他颜色。
相关问题
点击input时边框变色如何更改
您可以使用CSS的:focus伪类来更改输入框的边框颜色。例如,以下代码将在输入框获得焦点时将边框颜色更改为红色:
```
input:focus {
border-color: red;
}
```
您可以将这个CSS样式添加到您的CSS文件中,或将其添加到您的HTML文件的`<style>`标签中。
改变input单选按钮的颜色
要改变input单选按钮的颜色,可以使用CSS样式来实现。具体方法如下:
1. 首先,在HTML中添加一个input单选按钮,例如:
```html
<input type="radio" name="gender" value="male"> Male<br>
```
2. 接着,在CSS样式中为该单选按钮添加样式,例如:
```css
input[type=radio] {
background-color: #4CAF50; /* 设置背景颜色 */
color: white; /* 设置文本颜色 */
padding: 10px; /* 设置内边距 */
border-radius: 5px; /* 设置边框圆角 */
border: none; /* 去掉边框 */
cursor: pointer; /* 设置鼠标指针为手型 */
}
/* 鼠标悬停时的样式 */
input[type=radio]:hover {
background-color: #3e8e41;
}
```
3. 最后,在HTML中使用该样式,例如:
```html
<label for="male">Male</label>
<input type="radio" id="male" name="gender" value="male" style="color:red;">
```
其中,使用style属性可以设置单选按钮的颜色为红色。注意,这里的id属性和label标签的for属性要对应起来,这样点击label标签时也能选中该单选按钮。