css---4表单相关伪类
input:enabled{ color:red;}
input:disabled{ color:blue;}
表单的状态
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表单相关伪类的更多相关文章
- html5表单和伪类
type = "email"; 自带验证格式type = "url"; 网址 http//:type = "tel";移动端会变成数字键盘t ...
- 纯CSS实现表单验证
ladies and 乡亲们,表单验证你在做吗?客户端or服务器端,javascript or jquery,动手写 or 使用插件,今天我们来探索下使用纯css实现表单验证,借以学习css sele ...
- CSS选择器详解(伪类) 转 http://blog.csdn.net/Panda_m/article/details/50084699
CSS选择器详解 之 伪类 伪类对大小写不敏感 结构伪类选择器 结构伪类是CSS3新增的类型选择器,利用DOM树实现元素过滤,通过文档结构的相互关系来匹配元素,可以减少class和id属性的定义,使文 ...
- (10)用css建立表单
1.用css建立表单 本篇资料主要介绍使用css设置表单元素的方法. 表单是网页与用户交互所不可缺少的元素,表单是网页的访问者进行交互的接口,例如大家都常遇到的:网上注册.网上登录.网上交易.网上投票 ...
- 学习笔记 第十章 使用CSS美化表单
第10章 使用CSS美化表单 [学习重点] 正确使用各种表单控件 熟悉HTML5新增的表单控件 掌握表单属性的设置 设计易用性表单页面 10.1 表单的基本结构 表单包含多个标签,由很多控件组成 ...
- Reset.css和Normalize.css样式表初始化相关
(1)Reset.css 简介:在HTML标签在浏览器里有默认的样式,例如 p 标签有上下边距,strong标签有字体加粗样式,em标签有字体倾斜样式.不同浏览器的默认样式之间也会有差别,例如ul默认 ...
- HTML&CSS基础-子元素的伪类选择器
HTML&CSS基础-子元素的伪类选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html的源代码 <!DOCTYPE html> <html& ...
- java后台表单验证工具类
/** * 描述 java后台表单验证工具类 * * @ClassName ValidationUtil * @Author wzf * @DATE 2018/10/27 15:21 * @VerSi ...
- 微信小程序相关二、css介绍,菜单制作,表单相关,京东注册页面
一.第二天上午 1.1上午因为有其他的课所以没有去这个课,不过下午看复习的时候的概括,讲了DTD,语法特性,css选择器以及权重,还有一些简单的样式 1.2 DTD Docuement Type 声明 ...
随机推荐
- POJ2449-A*算法-第k短路
(有任何问题欢迎留言或私聊 && 欢迎交流讨论哦 题意:传送门 原题目描述在最下面. 给你一个有向图,求指定节点间的第k短路. 思路: 先反向跑出从终点开始的到每个节点的最短距离 ...
- mysql开启操作日志(包含所有操作)
配置 方法一:设置配置文件my.cnf(需重启) 添加以下参数 [mysqld] log_output=FILE # 日志打印到文件,默认配置,可以配置成table,日志就会记录到mysql库中的相应 ...
- class6_scale尺度
最终的运行效果(程序见序号7) #!/usr/bin/env python# -*- coding:utf-8 -*-# --------------------------------------- ...
- Linux下使用Eclipse 远程调试
1 开启端口 修改/apache-tomcat-7.0.40/bin/catalina.sh 在合适的位置(请自行判断,只要有JAVA_OPTS的设定前后即可)插入下面的设定:UI_DEBUG=&qu ...
- Lombok 常用注解
Lombok Lombok 能以简单的注解形式来简化 java 代码,提高开发人员的开发效率.例如开发中经常需要写的 javaBean,都需要花时间去添加相应的 getter/setter,也许还要去 ...
- Linux下core文件调试
1,ulimit -a查看默认参数 2,ulimit -c 1024 设置core文件大小,如果超过1024个blocks,则不会产生core文件 注:tune2fs -l /dev/sda8 输出分 ...
- 可读性 vs 效率
哪个重要. 应用层代码来说,实际上说任意一个重要都不为过, 但是到了内核里面之后,哪个重要. 肯定是效率阿,内核跑得慢,上面还有得玩么.
- Activiti学习笔记4 — 流程实例化
1.创建流程引擎对象 private ProcessEngine processEngine = ProcessEngines.getDefaultProcessEngine(); 2.启动流程 流程 ...
- POST提交数据之---Content-Type的理解
Content-Type是指http/https发送信息至服务器时的内容编码类型,contentType用于表明发送数据流的类型,服务器根据编码类型使用特定的解析方式,获取数据流中的数据. 在网络请求 ...
- Vue.js小游戏:测试CF打狙速度
此项目只测试反应速度,即手点击鼠标的反应速度 html代码 <div id="top">请等待图片变颜色,颜色便的那一刻即可点击测手速</div> < ...