input:enabled{ color:red;}

input:disabled{ color:blue;}
enabled or disable

表单的状态

input:checked{ width:100px;height:100px;}
<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<style>

input:checked{ width:100px;height:100px;}

</style>

</head>

<body>

<input type="checkbox" />

</body>

</html>

表格获取焦点 input:focus{}        !不适用div

            input:focus{

                background: pink;

            }
<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            input:focus{

                background: pink;

            }

            div:focus{

                background: blue;

            }

        </style>

    </head>

    <body>

        <input type="text"  value="" />

        <div style="width: 200px;height: 200px;background: red;" contenteditable="true" ></div>

    </body>

</html>

input:focus

input 模拟单选框

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            input:focus{

                background: pink;

            }

            div:focus{

                background: blue;

            }

        </style>

    </head>

    <body>

        <input type="text"  value="" />

        <div style="width: 200px;height: 200px;background: red;" contenteditable="true" ></div>

    </body>

</html>

！importent

css---4表单相关伪类的更多相关文章

  1. html5表单和伪类

    type = "email"; 自带验证格式type = "url"; 网址 http//:type = "tel";移动端会变成数字键盘t ...

  2. 纯CSS实现表单验证

    ladies and 乡亲们,表单验证你在做吗?客户端or服务器端,javascript or jquery,动手写 or 使用插件,今天我们来探索下使用纯css实现表单验证,借以学习css sele ...

  3. CSS选择器详解（伪类） 转 http://blog.csdn.net/Panda_m/article/details/50084699

    CSS选择器详解 之 伪类 伪类对大小写不敏感 结构伪类选择器 结构伪类是CSS3新增的类型选择器,利用DOM树实现元素过滤,通过文档结构的相互关系来匹配元素,可以减少class和id属性的定义,使文 ...

  4. （10）用css建立表单

    1.用css建立表单 本篇资料主要介绍使用css设置表单元素的方法. 表单是网页与用户交互所不可缺少的元素,表单是网页的访问者进行交互的接口,例如大家都常遇到的:网上注册.网上登录.网上交易.网上投票 ...

  5. 学习笔记 第十章 使用CSS美化表单

    第10章   使用CSS美化表单 [学习重点] 正确使用各种表单控件 熟悉HTML5新增的表单控件 掌握表单属性的设置 设计易用性表单页面 10.1  表单的基本结构 表单包含多个标签,由很多控件组成 ...

  6. Reset.css和Normalize.css样式表初始化相关

    (1)Reset.css 简介:在HTML标签在浏览器里有默认的样式,例如 p 标签有上下边距,strong标签有字体加粗样式,em标签有字体倾斜样式.不同浏览器的默认样式之间也会有差别,例如ul默认 ...

  7. HTML&CSS基础-子元素的伪类选择器

    HTML&CSS基础-子元素的伪类选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html的源代码 <!DOCTYPE html> <html& ...

  8. java后台表单验证工具类

    /** * 描述 java后台表单验证工具类 * * @ClassName ValidationUtil * @Author wzf * @DATE 2018/10/27 15:21 * @VerSi ...

  9. 微信小程序相关二、css介绍，菜单制作，表单相关，京东注册页面

    一.第二天上午 1.1上午因为有其他的课所以没有去这个课,不过下午看复习的时候的概括,讲了DTD,语法特性,css选择器以及权重,还有一些简单的样式 1.2 DTD Docuement Type 声明 ...

随机推荐

  1. flutter 死亡红屏 隐藏

    当组件报错的时候会出现红屏现象,解决办法是覆盖原有的ErrorWidget 用一个空白的组件去替换它 1.main.dart中进行修改 新增覆盖代码: void setCustomErrorPage( ...

  2. 更改idea启动内存信息

    1.到idea的安装目录的bin下,找idea64.exe.vmoptions 文件 2.更改参数 对应的参数解释: -Xms1024m    设置IDEA初时的内存大小,提高Java程序的启动速度. ...

  3. 【转】详解tomcat的连接数与线程池

    对tomcat线程池.Connector的BIO.NIO解析的很透彻的一篇文章. 原文链接:https://www.cnblogs.com/kismetv/p/7806063.html 前言 在使用t ...

  4. java 3des加密问题记录

    3des加密有不同的加密模式和填充模式,这个网上很多不多说了,只要保证加解密的时候加密模式和填充模式保持一致就可以了 首先对于密钥的生成,java中有2种方式: 1.第一种,采用ECB模式和不填充模式 ...

  5. PokerNet-poker recognition: 基于人工神经网络的扑克识别 （5）

    结果解读 结果1 结果2 结果1 void computeBCValue(cv::Mat mat_img, std::vector<bbox_t> result_vec, std::vec ...

  6. es5 JSON对象

    1. JSON.stringify(obj/arr) js对象(数组)转换为json对象(数组) 2. JSON.parse(json) json对象(数组)转换为js对象(数组) <!DOCT ...

  7. java多线程-AbstractQueuedSynchronizer

    大纲: AbstractQueuedSynchronizer简介 aqs基本结构 aqs应用-ReentrantLock.lock aqs应用-ReentrantLock.unlock aqs应用-S ...

  8. 树形dp——cf1092F

    被傻逼题降智了.. 就是第一次dfs 时 求一次size,一次deep数组 然后第二次dfs时直接求最大值 先把结点1的值求出来, u->v过程中,v子树的所有结点深度-1,v外的所有结点深度+ ...

  9. 怎样配置duilib

    duilib是一个免费的界面库,它可利用xml文件自定义界面元素,并且可以在商业项目中无偿使用.怎样在VS中配置duilib界面库呢?请看下面的介绍. 工具/原料 duilib 下载和编译duilib ...

  10. SpringBoot_03_SpringBoot对其他技术的整合

    1.SpringBoot整合Mybatis 1.2 添加Mybatis的起步依赖 <!--mybatis起步依赖--> <dependency> <groupId> ...