为TextArea加上漂亮的背景图片

2009-07-17 20:27:59 | 【大中小】

TextArea通常都很简单，不好看，这个代码教你怎么通过CSS给TextArea加上漂亮的背景图片

在网页<body>区添加以下代码

<style type="text/css">
<!--
.textarea {width:500px;height:70px;background:url(http://www.sharejs.com/images/logo.gif) no-repeat right top; }
.textfield {width:500px;height:18px;background-image:url(http://www.lanrentuku.com/down/js/images/12450456761.gif);color:#ccc;border:solid 1px #999;padding:3px 0px 0px 5px;}
-->
</style>
</head>

<body>
<br />
<br />
<table width="510" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="29"><input name="search" type="text" id="search" class="textfield" onfocus="if(this.value=='关键字') {this.value='';}this.style.color='#333';" onblur="if(this.value=='') {this.value='关键字';this.style.color='#ccc';}" value="关键字" maxlength="20"/></td>
  </tr>
  <tr>
    <td height="82"><textarea name="textarea" class="textarea"></textarea></td>
  </tr>

</table>

推荐给朋友

上一篇：图片不存在的时候显示一张默认图片
下一篇：漂亮的表单提交页面

为TextArea加上漂亮的背景图片

相关资源