文字
分享

语法:

E:focus { sRules }

说明:

设置对象在成为输入焦点(该对象的onfocus事件发生)时的样式。
  • webkit内核浏览器会默认给:focus状态的元素加上outline的样式。

兼容性:

IEFirefoxChromeSafariOperaiOS SafariAndroid BrowserAndroid Chrome
6.0-7.02.0+4.0+3.1+3.5+3.2+2.1+18.0+
IE8.0+

示例:

实例

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

<!DOCTYPE html>

<html lang="zh-cmn-Hans">

<head>

<meta charset="utf-8" />

<title>用户行为伪类选择符 E:focus_CSS参考手册_web前端开发参考手册系列</title>

<meta name="author" content="Joy Du(飘零雾雨), dooyoe@gmail.com, www.doyoe.com" />

<style>

h1 {

    font-size: 16px;

}

ul {

    list-style: none;

    margin: 0;

    padding: 0;

}

input:focus {

    background: #f6f6f6;

    color: #f60;

    border: 1px solid #f60;

    outline: none;

}

</style>

</head>

<body>

<h1>请聚焦到以下输入框</h1>

<form action="#">

    <ul>

        <li><input value="姓名" /></li>

        <li><input value="单位" /></li>

        <li><input value="年龄" /></li>

        <li><input value="职业" /></li>

    </ul>

</form>

</body>

</html>

            


运行实例 »

点击 "运行实例" 按钮查看在线实例

上一篇:E:active下一篇:E:lang(fr)