CSS :enabled选择器,匹配已启用元素

:enabled选择器

CSS伪类选择器之:enabled选择器可以用于匹配选择已经启用的HTML元素,而且一般用于表单元素之中。其中,表单的input默认情况下是已经启用的,未启用或被禁用需要设置disabled属性。


:enabled选择器语法

A:enabled{ 设置样式 }

提示:一般情况下,A也是选择器。


:enabled选择器实例代码,及在线编辑器

<span>用户名:</span><input type='text'>
<br>
<span>密 码:</span><input type='text'>
<br>
<input type='text' disabled placeholder='被禁用的input'>

<style>
  input:enabled{background-color:skyblue;}
</style>

实例内容提示

当在线运行上述实例时,当前网页其它的input的背景色的样式也会跟着更改,比如上面的站内搜索框,为了不影响当前网页的其它input该怎么办呢,可以为实例中的每个input元素添加一个相同的类属性,然后将input:enabled前面的元素选择器改成对应的类选择器即可。



全栈前端 / CSS教程 :



























Copyright © 2022-2024 笨鸟工具 x1y1z1.com All Rights Reserved.