我在这里有一些SCSS代码:
.location {
animation-delay: 80ms;
position: relative;
&:before {
font-family: "FontAwesome";
font-size: 24px;
content: "\f041";
position: absolute;
left: 4px;
top: 12px;
}
input {
text-indent: 28px;
}
}
我想更改.location:的文本颜色,然后再打开.location输入:focus。纯CSS甚至有可能吗?
任何帮助表示赞赏:)
最佳答案
尝试这个
$(document).ready(function() {
$('.location input').on('focusin', function(event) {
$('.location').addClass('text-red')
}).on('focusout', function(event) {
$('.location').removeClass('text-red')
});
})
.location {
animation-delay: 80ms;
position: relative;
}
.location:before {
content: "Hi....";
//font-family: "FontAwesome";
//font-size: 24px;
//content: "\f041";
position: absolute;
left: 4px;
top: 20px;
}
input {
text-indent: 28px;
}
.text-red:before {
color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="location">
<input type="text" name="">
</div>