CSS :enabled 伪类选择可用的元素并为其设置样式。
这些元素通常是表单元素,例如按钮(<button>)、选择菜单(<select>)、输入类型(<input>)和文本区域(<textarea>)。
启用的元素接受点击、文本输入或者焦点。
语法
:enabled { css declarations; }
:enabled 选择器的示例:
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <style> input { border: 1px solid #ccc; margin-bottom: 10px; padding: 2px 5px; } input[type=text]:enabled { background: #eee; } input[type=text]:disabled { background: #ccc; } </style> </head> <body> <h2>:enabled selector example</h2> <form action="#"> <label for="name">First name:</label> <input type="text" value="John" id="name"> <br> <label for="lastname">Last name:</label> <input type="text" value="Smith" id="lastname"> <br> <label for="country">Country:</label> <input type="text" disabled="disabled" value="10 High Street" id="country"> </form> </body> </html>
带有 <option> 标签的 :enabled 选择器示例:
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <style> option:enabled { background: #666; } </style> </head> <body> <h2>:enabled selector example</h2> <select> <option value="paris">Paris</option> <option value="london" disabled>London</option> <option value="moscow">Moscow</option> <option value="rome" disabled>Rome</option> <option value="berlin">Berlin</option> </select> </body> </html>
日期:2020-06-02 22:14:29 来源:oir作者:oir