首页 > 代码库 > 做一个所见即所得的CSS效果
做一个所见即所得的CSS效果
style 也是标签（在非ie内核的浏览器中支持），我们将style设置成 contenteditable的时候，那么那的内容就可以编辑了。仔细的体验下，如果我们将背景修改成红色的。那么只要书写完，立马呈现。哇靠，这很方便我们以后写那种动态的编辑器效果呢，等有时间的话，我再试试。洛宁县幼儿园
提示：你可以随意改变.test_div里的CSS代码，比如把green改成blue，#666什么的。
<style></style><style></style>附上我研究的代码：
<!DOCTYPE HTML><html ><head><meta http-equiv="Content-Type" content="text/html;charset=gb2312" /><title></title><style type="text/css">body style { display: block; background: #333; color: white; font: 13px/1.8 Monaco, Mono-Space; padding: 20px; white-space: pre; margin:0 auto; width:500px; height:100px;}</style></head><body> <style contenteditable>body {background: green;}</style></body></html> 想了解更多，可以去这里看看。
本文使用的并非body，而是div，相关代码如下：
<style type="text/css">.test_div style { display: block; background: #333; color: white; font: 14px/1.8 Courier New; padding: 20px; white-space: pre; margin:0 auto; width:250px; height:100px;}</style><div class="test_div"><style contenteditable>.test_div {background: green;}</style></div>Have fun.
做一个所见即所得的CSS效果
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。