实现div里面有placeholder形式
样式中设置content为元素的data-值
p{
color: deepskyblue;
}
p:before{
content: attr(data-beforeContent);
color: darkred;
}
然后js修改
$('p').on('click',function(){
$(this).attr('data-beforeContent','我被点击了');
});
实现div里面有placeholder形式的更多相关文章
- 移动端的坑 之 在可编辑的div中实现placeholder
1.当我们个 div 设置了 contenteditable = "true" 这个块状元素就可以编辑了, 如果要实现 placeholder 直接写上去是没有效果的 <d ...
- DIV实现CSS 的placeholder效果
placeholder是HTML5中input的属性,但该属性并不支持除input以外的元素 但我们可以使用Css before选择器来实现完全相同的效果 <!DOCTYPE html> ...
- textarea自适应高度,div模仿textarea可编辑实现自适应高度,placeholder使用图标
1.textarea自适应高度,placeholder使用图标 自适应高度,有很多种办法: 1)jq: $("textarea").on("input",fun ...
- div内容上下居中
今天无聊闲逛技术群,听一哥们说要在div里面居中span内容. 第一印象:vertical-align: middle; 结果失效.因为他只对属于inline的元素或是inline-block.tab ...
- 【html】【10】div布局[div水平垂直居中]
必看参考: http://www.jb51.net/css/28259.html 让div居中对齐缩写形式为: .style{margin:0 auto;} 数字0 表示上下边距是0.可以按照需要设置 ...
- React 以两种形式去创建组件 类或者函数(二)
08==>创建组件以 1类的形式 或者以 2函数的形式 09==>使用组件 在src下创建components文件夹 是放组件的 CompType.js 组件 组件开头大写(重要) Com ...
- div contenteditable 代替Textarea,做成Vue属性动态绑定
前言 一般都是用Textarea 文本来编辑,但发现可以用 div contenteditable = “true”,这个属性来搞定 <div contenteditable=true plac ...
- 实验六 DIV+CSS的综合应用
实验六 DIV+CSS的综合应用 [实验目的] 1.掌握DIV布局的方法: 2.利用CSS对DIV进行美化: 3.利用CSS对文本图像等网页元素进行美化 [实验环境] 连接互联网的PC ,Win7操作 ...
- 无可奈何的开始了jquery的“奇淫技巧”
转载请注明出处: https://home.cnblogs.com/u/zhiyong-ITNote/ 修改一个已有的项目,主要是前端方面,一般的项目后端都是处理好了的,不需要改也不能改,除非特殊需求 ...
随机推荐
- ThinkPHP5实用的数据库操作方法
1.update方法总结 /** * 设置记录的某个字段值 * 支持使用数据库字段和方法 * @access public * @param string|array $field 字段名 * @pa ...
- java.sql.SQLException: ORA-64203: 目标缓冲区太小, 无法容纳字符集转换之后的 CLOB 数据
<!--获取ae45at--> <select id="selectAe45at" parameterClass="java.util.Map" ...
- 前端实现预览ppt,word,xls,pdf文件
1.前端实现pdf文件在线预览功能 ps:刚好工作上有这个需求,所以到处找了一下处理方案,大家有需要可以试一下这几种方案,找到合适自己的 方式一. pdf文件理论上可以在浏览器直接打开预览但是需要打开 ...
- unlocked - 非锁定的标准输入输出函数
SYNOPSIS 总览 #include <stdio.h> int getc_unlocked(FILE *stream); int getchar_unlocked(void); in ...
- Mysql事务学习笔记
Mysql事务学习笔记 1.事务概述 事务是数据库的执行单元,它包含了一条或多条sql语句,进行的操作是要么全部执行,要么全部都不执行. 2.事务执行命令 语法格式: start transactio ...
- vue 学习五 深入了解components(父子组件之间的传值)
上一章记录了 如何在父组件中向子组件传值,但在实际应用中,往往子组件也要向父组件中传递数据,那么此时我们应该怎么办呢 1.在父组件内使用v-on监听子组件事件,并在子组件中使用$emit传递数据 // ...
- 过滤掉map集合中key或value为空的值
package cn.com.utils; import org.apache.commons.lang3.StringUtils; import java.util.Collection; impo ...
- thinkphp sql解析缓存
除了查询缓存之外,ThinkPHP还支持SQL解析缓存,因为ThinkPHP的ORM机制,所有的SQL都是动态生成的,然后由数据库驱动执行. 直线电机厂家 所以如果你的应用有大量的SQL查询需求,那么 ...
- Delphi 与SQL编程
Delphi 与SQL编程 SQL语言作为关系数据库管理系统中的一种通用的结构查询语言, 已经被众多的数据库管理系统所采用,如Oracle.Sybase.Informix等数据库管理系统,它们都支持S ...
- NX二次开发-NXOPEN创建工程图表格Annotations::TableSectionBuilder *tableSectionBuilder1;
NX9+VS2012 #include <uf.h> #include <uf_tabnot.h> #include <NXOpen/Part.hxx> #incl ...