DIV实现CSS 的placeholder效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Div+placeholder</title>
<style>
.rich{
color:balck;
width:100px;
height:100px;
border: 1px solid red;
margin: 20px 50%;
}
/*为空时显示 element attribute content*/
.rich:empty:before{
content: attr(placeholder); /* element attribute*/
/*content: 'this is content';*/
color:#red;
}
/*焦点时内容为空*/
.rich:focus:before{
content:none;
}
</style>
</head>
<body>
<div class='rich' contenteditable="true" placeholder='当 element 内容为空时,我就会出现'></div>
</body>
</html>
DIV实现CSS 的placeholder效果的更多相关文章
- 【jquery】基于 jquery 实现 ie 浏览器兼容 placeholder 效果
placeholder 是 html5 新增加的属性,主要提供一种提示(hint),用于描述输入域所期待的值.该提示会在输入字段为空时显示,并会在字段获得焦点时消失.placeholder 属性适用于 ...
- css三级菜单效果
一个简单实用的css三级菜单效果 <!doctype html> <html> <head> <meta charset="utf-8"& ...
- 利用target的特性，可以实现纯css的tab效果切换
基础知识: :target起作用的是href连接到的位置 如 <a href="#tab1">tab1</a> <div id="tab1& ...
- 推荐20款基于 jQuery & CSS 的文本效果插件
jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...
- js div浮动层拖拽效果代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- div垂直居中 css div盒子上下垂直居中
div垂直居中 css div盒子上下垂直居中,让DIV盒子在任何浏览器中任何分辨率的显示屏浏览器中处于水平居中和上下垂直居中. div垂直居中常用于单个盒子,如一个页面里只有一个登录布局,使用div ...
- css的border效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 基于单个 div 的 CSS 画图
原文: Single Div Drawings with CSS 译文: 基于单个 div 的 CSS 画图 译者: 前端外刊评论 译注:通读本文,强烈地感受到了技术与艺术的结合.赞作者的这句话:Re ...
- Css实现透明效果，兼容IE8
Css实现透明效果,兼容IE8 >>>>>>>>>>>>>>>>>>>>> ...
随机推荐
- 去除html标签 正则表达式
/// <summary> /// 去除html标签 /// </summary> public static string Clea ...
- ARP协议
ARP协议就是一个获取对方MAC地址的协议,ARP协议它是一个网络层的协议,它的作用是通过ARP request报文来获得对方的MAC地址,ARP报文里面发送的内容大概是192.168.1.20你的M ...
- Attribute "lazy" with value "true" must have a value from the list "false proxy no-proxy "
Hibernate 3.2 版本 当设置lazy="true"属性时,会产生该个异常: Attribute "lazy" with value "tr ...
- jexus ASP.NET开发注意项1
Jexus@宇内(273766940) 9:09:02 linux上的文件名和文件路径是大小写敏感的. Jexus@宇内(273766940) 9:10:11 在win上,你文件名是 Login.as ...
- Sql语句，先查询再插入一条语句完成。
if ( (select COUNT(*) from Hr where 考勤号码 = '149' and 日期时间 = '2015/7/3 12:00:26') = 0 )INSERT INTO [ ...
- JSP标准标签库（JSTL）之核心标签（下）
前面记录了核心标签的前几种,现在来接着记录. 七.<c:import>标签 使用<c:import>标签可以包含一个FTP服务器中不同的网页内容.语法格式: <c:i ...
- thinkpad E450 fn快捷键设置
只要按fn+esc两个按键就可以切换fn按键的使用方式
- [JS2] JS是弱类型
<html> <head> <title>JavaScript 是弱类型的</title> <Script Language="Java ...
- (转)Java动态代理与CGLib代理
<br>public class UserDAOImpl{ <br><br> public void save() { <br> / ...
- MySQL group_concat 1024 大小
1. GROUP_CONCAT有个最大长度的限制,超过最大长度就会被截断掉,你可以通过下面的语句获得: SELECT @@global.group_concat_max_len; show varia ...