样式中设置content为元素的data-值

    p{
color: deepskyblue;
}
p:before{
content: attr(data-beforeContent);
color: darkred;
} 然后js修改 $('p').on('click',function(){
$(this).attr('data-beforeContent','我被点击了');
});

实现div里面有placeholder形式的更多相关文章

  1. 移动端的坑 之 在可编辑的div中实现placeholder

    1.当我们个  div 设置了 contenteditable = "true" 这个块状元素就可以编辑了, 如果要实现 placeholder 直接写上去是没有效果的 <d ...

  2. DIV实现CSS 的placeholder效果

    placeholder是HTML5中input的属性,但该属性并不支持除input以外的元素   但我们可以使用Css before选择器来实现完全相同的效果 <!DOCTYPE html> ...

  3. textarea自适应高度,div模仿textarea可编辑实现自适应高度,placeholder使用图标

    1.textarea自适应高度,placeholder使用图标 自适应高度,有很多种办法: 1)jq: $("textarea").on("input",fun ...

  4. div内容上下居中

    今天无聊闲逛技术群,听一哥们说要在div里面居中span内容. 第一印象:vertical-align: middle; 结果失效.因为他只对属于inline的元素或是inline-block.tab ...

  5. 【html】【10】div布局[div水平垂直居中]

    必看参考: http://www.jb51.net/css/28259.html 让div居中对齐缩写形式为: .style{margin:0 auto;} 数字0 表示上下边距是0.可以按照需要设置 ...

  6. React 以两种形式去创建组件 类或者函数(二)

    08==>创建组件以 1类的形式 或者以 2函数的形式 09==>使用组件 在src下创建components文件夹 是放组件的 CompType.js 组件 组件开头大写(重要) Com ...

  7. div contenteditable 代替Textarea,做成Vue属性动态绑定

    前言 一般都是用Textarea 文本来编辑,但发现可以用 div contenteditable = “true”,这个属性来搞定 <div contenteditable=true plac ...

  8. 实验六 DIV+CSS的综合应用

    实验六 DIV+CSS的综合应用 [实验目的] 1.掌握DIV布局的方法: 2.利用CSS对DIV进行美化: 3.利用CSS对文本图像等网页元素进行美化 [实验环境] 连接互联网的PC ,Win7操作 ...

  9. 无可奈何的开始了jquery的“奇淫技巧”

    转载请注明出处: https://home.cnblogs.com/u/zhiyong-ITNote/ 修改一个已有的项目,主要是前端方面,一般的项目后端都是处理好了的,不需要改也不能改,除非特殊需求 ...

随机推荐

  1. MySQL在win10以及linux下数据库的备份以及还原

    MySQL在win环境或者linux下的命令都是一样的,只是路径不一致而已 MySQL的备份 (非必须)命令行进入MySQL的bin目录 输入命令:mysqldump -u userName -p d ...

  2. c# Winform 多线程操作

    主要是对一个过程需要的时间很长执行时会出现界面假死的情况 方法1: Application.DoEvents(),这种方法当你拖动窗体时,界面不会假死.但在你拖动时代码不再执行,也就是阻塞了,当你不再 ...

  3. 30-Ubuntu-用户权限-01-用户和权限的基本概念

    1.用户 用户是Linux系统工作中重要的一环,用户管理包括用户和组管理. 在Linux系统中,不论是由本机或是远程管理登录系统,每个系统都必须拥有一个账号,并且对于不同的系统资源拥有不同的使用权限. ...

  4. spring boot jpa 多表关联 @OneToOne @OneToMany @ManyToOne@ManyToMany

    1.一对一关联 @OneToOne import lombok.Data; import javax.persistence.*; /** * @Author: GWL * @Description: ...

  5. EtherCat开源主站SOEM在windows下工程配置

    截至2019年1月,虽然github上有1.3.3的更新,但是用的人估计还不多,而且1.3.2被官方认为bug严重弃用.所以还是学习1.3.1. 1.拷贝osal.oshw.soem.lib(已生成l ...

  6. JS的面向对象与原型

    原型 const yoshi = { skulk: true }; const hattori = { sneak: true }; const kuma = { creep: true }; ⇽-- ...

  7. 在SpringBoot 1.5.3上使用gradle引入hikariCP

    在SpringBoot 1.5.3上使用gradle引入hikariCP hikari来源于日语,是“光”的意思,号称“史上最快数据库连接池”,也是springboot2.0最新版默认的连接池.但是s ...

  8. 2019-9-25-如何让-USB-设备不显示安全删除硬件弹出选项

    title author date CreateTime categories 如何让 USB 设备不显示安全删除硬件弹出选项 lindexi 2019-09-25 11:58:19 +0800 20 ...

  9. Python脚本的name

  10. 第二天:PowerShell别名

    1.查询别名: Get-Alias -name ls Get-Alias -name dir Get-Alias -name fl Get-Alias -name ft 2.查看可用的别名 查看可用的 ...