一次偶然在鑫大技术博客上发现  style  标签配合contenteditable 可编辑属性 实现动态编辑css

　　这里我就回顾了下  contenteditable  可编辑属性 （这个属性并无浏览器兼容问题，常用来模拟textarea属性）

　　　　　　1.该属性有两个值   true（开启可编辑） false（关闭可编辑） 注意： 当元素中没有设置 contenteditable 属性时，元素将从父元素继承。

　　在style上利用 contenteditable属性 可将style内容类似于在textarea中显示出来，并且是可编辑的，在编辑的时候代码会相应的响应反馈给浏览器，这就给了我们可以利用该属性来做

<style contenteditable>.test-box{ width:60px;height:60px;background:pink;}</style>

css style 标签可编辑的更多相关文章

  1. style标签进行实时编辑及修改css(转)

    心得: style也是一个标签,那么也可以使用css对其进行编辑 html5新属性 contenteditable,可以让标签元素处于可编辑状态,对于style标签也适用 为了不影响head标签里的s ...

  2. style标签下的CSS代码的显示与实时编辑

    style标签也是标签 首先设置body style的样式 body style{ display:block; padding:0.6em 0.8em; border:1px dashed #ccc ...

  3. JS动态引入js,CSS——动态创建script/link/style标签

    一.动态创建link方式 我们可以使用link的方式.如下代码所示. 二.动态创建style方式 但是,这样的话,需要加载整个css文件,但是那样有可能浪费一个http请求并占用一个服务器请求数,并等 ...

  4. JS动态引入js、CSS动态创建script/link/style标签

    一.动态创建link方式 我们可以使用link的方式.如下代码所示. function addCssByLink(url){ var doc=document; var link=doc.create ...

  5. java 去掉html/style/css等标签

    //定义script的正则表达式 private static String regEx_script="<script[^>]*?>[\\s\\S]*?<\\/sc ...

  6. HTML+css基础 标签的起名 style标签 选择器的使用规则

    标签的起名: 1. 官方提供的标签名 2. 类名: 用class属性起的名字 3. Id名: 用id属性起的名字 唯一的 我们把这种起名叫选择器 class选择器 id选择器  标签选择器 style ...

  7. CSS各类标签用法——选择器

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  8. php有效的过滤html标签,js代码,css样式标签

    过滤html标签�php中太简单了,我们可以直接使用strip_tags函数来实现了,下面给各位整理了一些关于 strip_tags函数的例子. php过滤html的函数:strip_tags(str ...

  9. JavaScript CSS Style属性对照表

    JavaScript CSS Style属性对照表 盒子标签和属性对照 CSS语法 (不区分大小写) JavaScript语法 (区分大小写) border border border-bottom ...

随机推荐

  1. 移动文件读/写指针----lseek

    头文件:#include<sys/types.h>.#include<unistd.h> 函数原型:off_t lseek(int fildes,off_t offset,in ...

  2. 2018.09.18 atcoder Many Formulas（搜索）

    传送门 感觉自己搜索能力退化了,这种弱智搜索写了整整5min,这样下去比赛会凉的. 看来得多练练题了. 代码: #include<bits/stdc++.h> #define ll lon ...

  3. SQL查询优化的一些建议

    使用批量查询,而不是N次循环查询! 重复的数据,不要重复获取: 根据需要,按需要获取表字段,而不是SELECT *: 针对频繁的搜索字段,建立必要的索引,以加快查询速度: 使用关联查询,而不是粗暴地类 ...

  4. hdu-1728（bfs+优化）

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1728 注意:1.先输入起点(y1,x1)和终点(y2,x2): 2.如果一个一个遍历会超时. 思路:每 ...

  5. Caused by: Unable to load configuration. - action - file:/C:/apache-tomcat-7.0.70/webapps/Structs/WEB-INF/classes/struts.xml:7:72 at com.opensymphony.xwork2.config.ConfigurationManager.getConfigurati

    Unable to load configuration. - action - file:/C:/apache-tomcat-7.0.70/webapps/Structs/WEB-INF/class ...

  6. 编写属于自己的linux命令

    开篇: 问题和解决思路 在使用一些基础IDE时,工具经常会在我们建立特定文件时给我们一个已经有了一些特定代码的模板文件,但是在linux开发时,没有这样的IDE,怎么办?虽然代码量不是很多,但是能一次 ...

  7. Ubuntu 16.04下安装网络流量分析工具 Wireshark

    本文链接地址:https://www.linuxidc.com/Linux/2016-08/134526.htm 切勿用商业用途 sudo apt-add-repository ppa:wiresha ...

  8. jpg/png格式图片转eps格式的方法--latex自带命令bmeps

    bmeps -h 命令查看bmeps的帮助信息 bmeps -c example.jpg example.eps

  9. Oracle 在not in中使用null的问题

    http://www.linuxidc.com/Linux/2012-07/66212.htm 以前还专门小总结过一下Oracle中关于NULL的一些问题,碰巧今天在看书的过程中又看到了另外一个以前没 ...

  10. cassandra集群缩容与剔除问题节点

    今天在操作cassandra集群数据迁移时发生了一些意料之外的事情,服务器迁移前与迁移后同样为5台,但是不知道是什么原因导致的,迁移过后的节点居然多出了一台cassandra节点,个人瞬间感觉莫名其妙 ...