一次偶然在鑫大技术博客上发现  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. part1:15-安装Linux系统到开发板

    1.Qtopia简介 Qtopia是Trolltech公司为采用嵌入式Linux操作系统的消费电子设备而开发的综合应用平台,Qtopia包含完整的应用层.灵活的界面用户.窗口操作系统.应用程序启动程序 ...

  2. sql中 in 、not in 、exists、not exists 用法和差别

    % 的一类. NOTIN:通过 NOTIN 关键字引入的子查询也返回一列零值或更多值. 以下查询查找没有出版过商业书籍的出版商的名称. SELECT pub_name FROM publishers ...

  3. 100 floors 2 eggs

    https://github.com/Premiumlab/Python-for-Algorithms--Data-Structures--and-Interviews/blob/master/Moc ...

  4. 2018.09.10 bzoj1855: [Scoi2010]股票交易(单调队列优化dp)

    传送门 单调队列优化dp好题. 有一个很明显的状态设置是f[i][j]表示前i天完剩下了j分股票的最优值. 显然f[i][j]可以从f[i-w-1][k]转移过来. 方程很好推啊. 对于j<kj ...

  5. 2018.09.08 NOIP模拟 division(状压dp)

    这么sb的题考场居然写挂了2233. 假设n=∏iaiki" role="presentation" style="position: relative;&qu ...

  6. ImageResizer 3.4.3配置

    <?xml version="1.0" encoding="utf-8"?> <!-- For more information on how ...

  7. gj6 深入python的set和dict

    6.1 collections中的abc from collections.abc import Mapping, MutableMapping #dict属于mapping类型 a = {} pri ...

  8. python 判断是否是空行或注释行

    #coding:utf-8 '''''cdays-4-exercise-6.py 文件基本操作 @note: 文件读取写入, 列表排序, 字符串操作 @see: 字符串各方法可参考hekp(str)或 ...

  9. 大文件webuploader的基本使用

    webuploader的简单使用 需要的文件   自备  百度很多 webuploader.js  uploader.swf  jQuery <!DOCTYPE html> <htm ...

  10. C++中的关键字用法---typename

    1. typename 关键字 "typename"是一个C++程序设计语言中的关键字.当用于泛型编程时是另一术语"class"的同义词.这个关键字用于指出模板 ...