input{ background-color: transparent; width: 70%; color: rgba(17,17,17,0.85); border: none; /* 下边框样式 */ border-bottom: 1px solid rgba(17,17,17,0.85); padding: 10px 0; text-indent: 10px; margin: 8px 0; font-size: 14px; letter-spacing: 2px; } input::placeholder{ color: #fff; } input:focus{ color: rgba(17,17,17,0.85); outline: none; border-bottom: 1px solid rgba(17,17,17,0.85); transition: 0.5s; } input:focus::placeholder{ opacity: 0; } 在这个css中input字体无法更改
时间: 2024-03-22 11:42:28 浏览: 114
Change-Background-Color:JavaScript更改背景颜色
这个CSS样式表中,给`input`元素设置了`color`属性,但是给`input:focus`元素设置了另外的`color`属性,所以在聚焦输入框时,输入框中的文本颜色会发生改变。如果你想要更改输入框中的文本颜色,可以修改`input`元素和`input:focus`元素中的`color`属性值。
例如,如果你要将输入框中的文本颜色设置为红色,可以修改为:
```css
input {
background-color: transparent;
width: 70%;
color: red; /* 将颜色属性值修改为红色 */
border: none;
border-bottom: 1px solid rgba(17, 17, 17, 0.85);
padding: 10px 0;
text-indent: 10px;
margin: 8px 0;
font-size: 14px;
letter-spacing: 2px;
}
input::placeholder {
color: #fff;
}
input:focus {
color: red; /* 将颜色属性值修改为红色 */
outline: none;
border-bottom: 1px solid rgba(17, 17, 17, 0.85);
transition: 0.5s;
}
input:focus::placeholder {
opacity: 0;
}
```
这样,输入框中的文本颜色就会变为红色。
阅读全文