我在后台有一个带有视频的表单。如果在输入框中没有输入文本,我希望它们具有不透明度0.但是当值不为零时,我希望它们具有背景颜色。我以为我可以使用占位符。
现在我只有当输入处于焦点时显示背景颜色,如下所示
.for_ajax_contact #contactform input[type="text"]:focus, .for_ajax_contact #contactform textarea:focus {
outline-width: 0;
background-color: #fff;
opacity: 0.8;
transition: all 0.3s linear 0s !important;
-webkit-transition: all 0.3s linear 0s !important;
}
有什么想法吗?
答案 0 :(得分:0)
你可以在没有JavaScript的情况下做到这一点,但有一个问题。您需要在required
/ textarea
上使用HTML5 input
属性,并在每个表单元素上设置:valid
伪类的样式。
input,
textarea {
background: white;
}
input:valid,
textarea:valid {
background: green;
color: white;
}
<input required type="text">
<textarea required></textarea>
如果不是首选,那么您需要像评论者建议的那样使用JavaScript路线。
答案 1 :(得分:0)
有一个CSS伪类@From(eventtable='rdbms', datasource.name='WSO2_CARBON_DB', table.name='pharming_incident')
define table pharming_incident (phi_id_pharming_incident long, phi_id_license int, phi_machine_user_id string, phi_date string, phi_machine_user_date string, phi_protected_site string, phi_pharming_glp string,
phi_user_ip string, phi_dsb_version string, phi_os string, phi_os_version string, user_id int);
,用于检测占位符是否存在。不幸的是,这是CSS Level 4的规范,它只在编写本文时适用于WebKit浏览器。
:placeholder-shown
input:placeholder-shown {
background: black;
}