<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <style type="text/css">
        input[type=text]:hover {
        background-color:limegreen;
        }
        input[type=text]:active {
        background-color:skyblue;
        }
        input[type=text]:focus{
        background-color:#00ff90;
        }
    </style>
</head>
<body>
<!-- E:hover
    选择器被用来指定当鼠标指针移动到元素上时,元素所使用的样式,方法如下:
    <元素>:hover
    {
      //指定样式。
    }
     -->
    <!-- E:active
        选择器被用来指定元素被激活(就是按下没有释放时)所使用的样式。 -->
    <!-- E:focus
        选择器被用来指定元素获取焦点时所使用的样式。 -->
    <form>
        <p>姓名:<input type="text" name="name" /></p>
        <p>地址:<input type="text" name="address" /></p>
    </form>
</body>
</html>

效果如下:

选择器(E:hover/E:active/E:focus的使用)的更多相关文章

  1. CSS样式中visited,hover,active , focus这四个分别表示什么意思?

    CSS伪类用于向某些选择器添加特殊的效果.CSS又名层叠样式表,所谓层叠,就是后面的样式会覆盖前面的样式,所以在样式表中,各样式排列的顺序很有讲究. :link 与 :visited 在样式文件中的顺 ...

  2. 伪类link,hover,active,visited,focus的区别

    例一: /*css*/a:link{  color: blue;}a:visited{  color: green;}a:hover{  color: red;}a:focus{ color:blac ...

  3. a标签伪类link,hover,active,visited,focus区别

    <div id="content"> <h3><a class="a1" href="#">a标签伪类l ...

  4. 转载利用伪元素单个颜色实现 hover 和 active 时的明暗变化效果

    1.颜色小tip知识 在背景色上方叠加一个黑色半透明层 rgba(0,0,0,.2) 可以得到一个更暗的颜色 在背景色上方叠加一个白色半透明层 rgba(255,255,255,.2) 可以得到一个更 ...

  5. 如何消除移动端a标签点击时的蓝色底色以及a标签link、visited、hover、active的顺序

    1.消除a标签移动端点击时的蓝色底色 -webkit-tap-highlight-color:transparent 2.link.visited.hover.active的顺序 a:link{tex ...

  6. a:link,a:visited,a:hover,a:active

    1:解释 link:连接平常的状态 visited:连接被访问过之后 hover:鼠标放到连接上的时候 active:连接被按下的时候      详细的: :hover版本:CSS1/CSS2 兼容性 ...

  7. a标签的link、visited、hover、active的顺序

    a标签的link.visited.hover.active是有一定顺序的,以下是我一直在用的一个顺序,能正确显示四个颜色,我也不知道有没有其他的顺序能正确显示,如果你没办法判断哪个是对的,那就先用这个 ...

  8. 你知道hover、active这四个伪类为什么要按顺序写吗

    刨根问底,你知道:hover等4个伪类为什么要按顺序排列吗 引言 :link,:visited,:hover,:active这4个伪类大家都不陌生,4个伪类要按照LvHa这个爱恨原则来排(外国友人起的 ...

  9. css中链接的4个状态 link、visited 、hover、active 顺序与设置

    link       未点时链接色visited  已点过的链接色hover   光标放入链接上的色active   点击时的样式 顺序一定要按link.visited.hover.active来设置 ...

随机推荐

  1. call方法的使用bug--参数undefined

    call/apply是函数原型定义的方法(Function.prorotype),在使用时要注意第一个形参(args[0]),一定是指向函数所要挂载的上下文对象--context,若对象非必须,则要将 ...

  2. js实现表单checkbox的单选,全选

    全选&单选 //<input type="checkbox" name="" class="quan" value=" ...

  3. ES6学习笔记(1)----let和const命令

    参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ let和const命令 let 总结1.声明变量基本使用方法与var 相同  不同点  a.在代 ...

  4. 'NSUnknownKeyException' … setValue:forUndefinedKey:]: …not key value coding compliant

    解决一个问题: 当我添加一个IBout, 报了如下错误 NSUnknownKeyException' … setValue:forUndefinedKey:]: …not key value codi ...

  5. JData 整合ArtTemplate的前端框架

    因为项目需要和自己的兴趣,几个月前结合模板解析神速的ArtTemplate,自己写了个框架取名JData,多多指教啊---因为一直没时间写文档,为了能够更方便地使用和避免我把代码忘了,今天抽空把文档写 ...

  6. 针对windowsserver 创建iis站点访问出错的解决方案(HTTP 错误 500.19 - Internal Server Error)

    错误如下:   服务器错误 Internet信息服务 7.0 错误摘要HTTP 错误 500.19 - Internal Server Error 无法访问请求的页面,因为该页的相关配置数据无效. 详 ...

  7. CAD参数绘mcdbsolid对象(网页版)

    主要用到函数说明: _DMxDrawX::DrawSolid 绘McDbSolid对象.详细说明如下: 参数 说明 DOUBLE dX1 第一个点X DOUBLE dY1 第一个点Y DOUBLE d ...

  8. Java集合(二)--Iterator和Iterable

    Iterable: public interface Iterable<T> { Iterator<T> iterator(); } 上面是Iterable源码,只有一个ite ...

  9. vlmcsd-1111-2017-06-17

    Source and binaries: http://rgho.st/6c6R7RwMZ   全部编译好了 https://www.upload.ee/files/7131474/vlmcsd-11 ...

  10. js检测是哪个浏览器

    项目中遇到在火狐浏览器下引入iframe页面,导致那个地方感觉掉下去一点,解决方案就是单独对火狐浏览器进行样式处理,需要检测浏览器类型,在网上找到此方法解决问题,也分享给大家 function get ...