CSS：好玩的‘伪类’系列之——(:focus)

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/gavincz/article/details/89532792

:focus 

定义：获得焦点的元素，一般用于表单（input、textarea）；

触发条件：当用户点击或触摸元素或通过键盘的 “tab” 键选择它时会被触发

兼容：Opera7以下 及 IE8以下不兼容

举个栗子：

html代码：

  <p><input type="text" name=""></p>
  <p><input type="password" name=""></p>
  <p><input type="email" name=""></p>
  <p><textarea name=""></textarea></p>

css代码：

input:focus{
  background-color: #000;
  color: #fff;
  border: none;
}
textarea:focus{
  background-color: #000;
  color: #fff;
  border: none;
}

效果图：