您可以使用:占位符显示的伪类。从技术上讲，占位符是必需的，但您可以使用空格代替。

输入:没有(placeholder-shown) { 边框颜色:绿色; } 输入:placeholder-shown { 边框颜色:红色; } <input placeholder="Text is required" /> <input placeholder=" " value="This one is valid" /> <input placeholder=" " /> .

您可以使用:占位符显示的伪类。从技术上讲，占位符是必需的，但您可以使用空格代替。

输入:没有(placeholder-shown) { 边框颜色:绿色; } 输入:placeholder-shown { 边框颜色:红色; } <input placeholder="Text is required" /> <input placeholder=" " value="This one is valid" /> <input placeholder=" " /> .

是的!你可以用简单的基本属性和值选择器来做。

使用空值属性选择器并应用属性 输入(值= ")

input[value=''] {
    background: red;
}

在这里。fase是html代码中的一个输入类。

div.fase > input:focus:required:invalid { 
    color: red;
    border-color: red; 
    box-shadow: 0 0 6px red;
}

div.fase input:focus:required:valid,
input:focus:required:placeholder-shown {
    border-color: rgb(22, 172, 22);
    box-shadow: 0 0 8px rgb(28, 150, 28);
}

div.fase input:valid {
    border-color: rgb(47, 148, 49);
}

你可以根据输入[type=text]是否有文本来样式化占位符。这不是一个官方标准，但有广泛的浏览器支持，尽管有不同的前缀:

input[type=text] {
    color: red;
}
input[type=text]:-moz-placeholder {
    color: green;
}
input[type=text]::-moz-placeholder {
    color: green;
}
input[type=text]:-ms-input-placeholder {
    color: green;
}
input[type=text]::-webkit-input-placeholder {
    color: green;
}

例如:http://fiddlesalad.com/scss/input-placeholder-css

简单的css:

input[value]:not([value=""])

如果输入被填满，这段代码将在页面加载上应用给定的css。