状态伪类选择器

• ele:disabled{ } 选择界面上处于禁用状态的元素

• ele:enabled{ } 选择界面上处于可用状态的元素

• ele:checked{ } 选择界面上处于被选中状态的元素

        /* ele:enabled{ } 选择界面上处于可用状态的元素 */
          input:enabled {
              background-color: tomato;
          }
  ​
          input[type=password]:enabled {
              background-color: yellowgreen;
          }
  ​
          /* ele:disabled{ } 选择界面上处于禁用状态的元素 */
          input:disabled {
              background-color: purple;
          }
  ​
          /* ele:checked{ } 选择界面上处于被选中状态的元素 */
          input:checked {
              width: 50px;
              height: 50px;
              opacity: .5;
          }
  ​
          input[type=radio]:checked {
              width: 30px;
              height: 30px;
              opacity: .5;
          }
  ​
  ​
      <ol>
          <li>
              账号：<input type="text">
          </li>
          <li>
              密码：<input type="password">
          </li>
          <li>
              账号1：<input type="text" disabled>
          </li>
          <li>
              账号2：<input type="text" disabled>
          </li>
          <li>
              性别：<input type="radio" checked>男
              <input type="radio">女
          </li>
          <li>
              性别：<input type="checkbox">吃饭
              <input type="checkbox" checked>睡觉
              <input type="checkbox" checked>打豆豆
          </li>
      </ol>
  ​