css伪类的组合用法
利用伪类组合,可以用css代替js以达到目的,少些一下js
.textarea:empty:before {
display: block;
content: '请输入';
color: #ababab;
font-size: 15px;
text-align: left;
}
//表示:当textarea元素为空时即没有输入时,有“请输入”这句提示语显示
.textarea:focus:before {
display: none;
}
//当textarea元素聚焦时,刚刚用before伪类加的“请输入”就会隐藏
.textarea:empty:after {
content: '请认真填写。';
color: #ababab;
font-size: 11px;
text-align: left;
}
.textarea:focus:focus {
display: none;
}
first-child:after
.order:empty+.a {
display: block;
}
//order元素为空时,它下面的那个元素a显示
css伪类的组合用法的更多相关文章
- 关于css伪类:hover的用法
关于伪类:hover大家都用过,也比较熟悉.今天介绍一种新的用法(不是我发现的,但是以前一直没这么用过).在Chrome浏览器下,当a标签使用display:black;时a:hover的属性浏览器就 ...
- 彻底搞懂CSS伪类选择器:is、not
本文介绍一下Css伪类:is和:not,并解释一下is.not.matches.any之前的关系 :not The :not() CSS pseudo-class represents element ...
- CSS伪类选择器:is、not
本文介绍一下Css伪类:is和:not,并解释一下is.not.matches.any之前的关系 :not The :not() CSS pseudo-class represents element ...
- CSS 伪类 (Pseudo-classes)
CSS 伪类用于向某些选择器添加特殊的效果. CSS 伪类 (Pseudo-classes)实例: 超链接 本例演示如何向文档中的超链接添加不同的颜色. 超链接 2 本例演示如何向超链接添加其他样式. ...
- CSS伪类选择器
一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链 ...
- 【从0到1学Web前端】CSS伪类和伪元素
1.CSS中的伪类 CSS 伪类用于向某些选择器加入特殊的效果. 语法: selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用 select ...
- CSS伪类的理解
因为之前一直对css伪类没有过多的了解,在网上看到一段css代码,不能理解 a:hover span.title{ color:red; ......... } 现通过查询css手册,其实css伪类只 ...
- CSS 伪类 (Pseudo-classes)实例
CSS 伪类 (Pseudo-classes)实例CSS 伪类用于向某些选择器添加特殊的效果在支持 CSS 的浏览器中,链接的不同状态都可以不同的方式显示,这些状态包括:活动状态,已被访问状态,未被访 ...
- CSS伪类before,after制作左右横线中间文字效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- ACM 序号互换
序号互换 时间限制:1000 ms | 内存限制:65535 KB 难度:2 描述 Dr.Kong设计了一个聪明的机器人卡多,卡多会对电子表格中的单元格坐标快速计算出来.单元格的行坐标是由数字 ...
- 微信开源PHP商城系统一处blind xxe(无需登录,附POC)
测试版本wemall 3.3 下载地址 http://git.oschina.net/einsqing/wemall/repository/archive?ref=master 需要开源中国的账号 c ...
- 1787: [Ahoi2008]Meet 紧急集合
1787: [Ahoi2008]Meet 紧急集合 Time Limit: 20 Sec Memory Limit: 162 MBSubmit: 1482 Solved: 652[Submit][ ...
- java 学习 todoList
1.并发包的使用 2.线程相关的源码,怎么结束一个线程 3.单例模式代码 4.mixin 相关的理解代码 书单: effective java java 编程思想 spring 编程指南 深入理解jv ...
- 深入浅出数据结构C语言版(4)——表与链表
在我们谈论本文具体内容之前,我们首先要说明一些事情.在现实生活中我们所说的"表"往往是二维的,比如课程表,就有行和列,成绩表也是有行和列.但是在数据结构,或者说我们本文讨论的范围内 ...
- 微信公众号java开发思路
方法一:不开启开发模式,直接在自定义菜单中跳转到网页,适用于流量较小的公众号. 方法二:开启开发者模式,关闭自带的自定义菜单和消息回复,接入自己开发的应用 1.接入校验:创建s ...
- pcntl_fork 导致 MySQL server has gone away 解决方案
pcntl_fork 前连数据库,就会报 MySQL server has gone away 错误.原因是子进程会继承主进程的数据库连接,当mysql返回数据时,这些子进程都可以通过这个连接读到数据 ...
- tomcat常见错误
在这里总结下之前遇到的关于Tomcat的错误: 第一个: web.xml 文件配置的 url-pattern 出现了与其他工程中重名的访问url 在console台可以看到这行报错的代码: Cause ...
- 编程语言基础:用“收集器”理解各种语言(C++、Java、Python)中的可变参数!
[C++通常用一种特殊的List收集可变形参,而Java通常用一个数组,Python收集为tuple.dict.] 1.Java中的可变参数的函数:void f(ClassName... object ...
- 使用MyBatis对数据库中表实现CRUD操作(二)
一.使用MyBatis对表实现CRUD操作 1.定义sql映射 userMapper.xml <?xml version="1.0" encoding="UTF-8 ...