优化textarea的样式---背景图片的实现

管理杂谈OA答疑ERP答疑教程搜索

优化textarea的样式---背景图片的实现

1，初始状态：
http://72color.com/upload/200907271344392134.jpg
当鼠标点进去写东西的时候，如下图：
http://72color.com/upload/200907271344426615.jpg
默认用了一个bg图片，在文本框获得一次焦点后把背景图片去掉了，后来再失去焦点的时候用的是第三个样式。
代码是copy下来的，图片路径修改成了绝对路径。

view source print? 01.http://w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> 02. 03. 04.输入框textarea提示点击消失效果 - 时代前端 05. 06. 11. 13. 14. 15.

由时代前端收集整理 http://52shidai.com/ 时代前端

16.

17.</body> 
18.</html>
</div>

<iframe style="width:100%; height:120px; display:none;" name="weixin_share" id="weixin_share" src=""></iframe>
<input type="hidden" id="appid" name="appid" value="">
<input type="hidden" id="timestamp" name="timestamp" value="">
<input type="hidden" id="noncestr" name="noncestr" value="">
<input type="hidden" id="signature" name="signature" value="">
<input type="hidden" id="share_link" name="share_link" value="">
<input type="hidden" id="cd" name="cd" value="">
<script type="text/javascript" src="/mis/bbs/js/prism.js"></script><br>
<div style="width: 100%; padding-top: 3px; padding-bottom: 3px; margin-top: 0px; margin-bottom: 0px; white-space: normal; min-height: 1.5em; word-wrap: normal; word-break: normal; line-height: 32px; color: rgb(62, 62, 62); text-align: center; background-color:#FF9C00;"><strong><span style="color: rgb(255, 255, 255);">更多精彩文章浏览...</span></strong></div>
<iframe style="width:100%;height:250px;border:none;margin-top:0px;margin-bottom:0px;" src="/mis/bbs/showappmore.asp" frameborder="0"></iframe>
<div style="padding-top: 3px; padding-bottom: 3px; white-space: normal; min-height: 1.5em; word-wrap: normal; word-break: normal; line-height: 32px; color: rgb(62, 62, 62); text-align: center; background-color: rgb(0, 187, 236);"><strong><span style="color: rgb(255, 255, 255);">点击右上角图标分享到朋友圈</span></strong></div>
<div style="margin-top:5px;margin-left:6px;">官方网站：<a href="http://www.clicksun.cn" style="text-decoration:none;color:#0080FF;">http://www.clicksun.cn</a></div>
<div style="margin-top:3px;margin-left:6px;">咨询热线：<a href="tel:400-186-1886" style="text-decoration:none;color:#0080FF;">400-186-1886</a></div>
<div style="margin-top:3px;margin-left:6px;margin-bottom:5px;">服务邮箱：<a href="mailto:service@clicksun.cn" style="text-decoration:none;color:#0080FF;">service@clicksun.cn</a></div>
<div style="width: 100%; margin:0px 0px 0px 0px; background-color:#FF9C00;"><a href="http://www.clicksun.cn"><img src="/files/all_around/cs_weixin_down.png?id=20181207" width="100%" border="0" /></a></div>
<script language="javascript">
document.body.oncopy=function(){
event.returnValue=false;
var txt_cr=document.selection.createRange().text;
var copy_cr="资料来源：深圳市点晴信息技术有限公司(www.clicksun.cn), 原文地址："+document.location;
txt_cr=txt_cr+"\r\n\r\n\r\n"+copy_cr;
window.clipboardData.setData("Text",txt_cr);
}

Prism.hooks.add('before-sanity-check', function (env) {
		env.element.innerHTML = env.element.innerHTML.replace(/<br>/g, '\n');
		env.code = env.element.textContent;
	});
	
</SCRIPT>

<iframe style="WIDTH:0px;HEIGHT:0px;display:none;" name="city_edit" id="city_edit" src="" frameborder=0></iframe>
</body>
</html>