<!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. avd manager或sdk manager无法打开

    最近开始搞安卓,使用AS启动项目时老是报各种错误,而网上这方面的资料很多都解决不了.只能边实验边做. 定位到avd manager或sdk manager无法打开,网上找了很多资料,都不能解决,知道看 ...

  2. jQuery.ajax() 设置 Headers 中的 Accept 内容

    jQuery.ajax() 如何设置 Headers 中的 Accept 内容   其实很简单,首先如果是常见类型,则请直接设置 dataType 属性 $.ajax({ dataType: &quo ...

  3. Node.js——优先从缓存加载

    main中执行require操作,目的是获取接口对象,所以多次引用b,并不会重复执行模块内部的输入输出,因为缓存中已经存在

  4. 谈谈如何学习Linux操作系统

     献给初学者:为了能把这篇不错的文章分享给大家.所以请允许我暂时用原创的形式展现给大家. @hcy 更多资源:http://blog.sina.com.cn/iihcy 一. 选择适合自己的linux ...

  5. Java常用工具类---image图片处理工具类、Json工具类

    package com.jarvis.base.util; import java.io.ByteArrayInputStream;import java.io.ByteArrayOutputStre ...

  6. day23-2 __call__、__str__和__del__

    目录 __call__ __str__ __del__ __call__ 对象后面加括号调用时,会自动触发执行 注:构造方法的执行是由创建对象触发的,即:对象=类名();而对于__call__方法的执 ...

  7. cesium 原理 之 command拼接

    VAO VAO(Vertext Array Object),中文是顶点数组对象.之前在<Buffer>一文中,我们介绍了Cesium如何创建VBO的过程,而VAO可以简单的认为是基于VBO ...

  8. OneinStack 安装 LNMP 切换PHP版本

    如果你的环境不是OneinStack安装的  ,可以略过这条博客了 注意:以下所有命令若提示权限不足 请在命令前加 sudo *** ①,首先查看当前已安装的PHP版本,我这里安装了好几个版本,你们可 ...

  9. IIS+php服务器无法上传图片解决办法

    查找网上资料,发现php.ini下面有2个地方关于上传的配置: file_uploads = On  这里设置是否允许HTTP上传,默认应该为ON的 ;upload_tmp_dir=  这里设置上传文 ...

  10. nodejs学习（一） ---- nodejs + express应用生成器 快速创建应用

    1.node安装及环境配置(自行百度) 2.express安装及配置 (自行百度) 3.通过应用生成器工具 express 快速创建应用骨架   全局安装应用生成器 : npm install exp ...