给“文本域”添加外套
网络通信
个人网站的设计者从不放弃对页面中每一个角落的修饰,很多朋友把个人主页设计得越来越“酷”,如鼠标跟随、另类表格、交互式菜单、滚动条颜色变化等等。笔者近来注意到了“文本域”,其实我们只需按照下面方法稍作一下改动,就能为文本穿上漂亮的外套了。
第一步:运行Dreamweaver,点击“插入”项中的“表单→文本区域”,插入一个文本区域。
第二步:对“文本区域”的属性进行设置,如“字符宽度”为45,“行数”为10。
第三步:点击“代码视图和设计视图”,此时会出现HTML代码窗口,在工作区中选择刚才插入的“文本区域”,此时你会看到如下代码:
<textarea name="textarea" cols="45" rows="10"></textarea>
将这段代码修改为:<textarea name="textarea" cols="45" rows="10" style="background-image: url('./image/tupian.jpg')"> </textarea>
注意:站点中的image文件夹中一定要有tupian.jpg图片文件,此图片文件不存在,则没有效果。
按上面的方法将代码添加以后保存网页,最后按F12在浏览器中即可浏览到效果。
小知识:文本域是用户输入响应的表单对象,分为三种类型的文本域:
单行文本域:通常提供单字或短语响应,如姓名或地址。
多行文本域:为访问者提供一个较大的区域,供其输入响应。可以指定访问者最多可输入的行数以及对象的字符宽度。如果输入的文本超过这些设置,该域将按照换行属性中指定的设置进行滚动。
密码域:是特殊类型的文本域。当用户在密码域中键入密码时,所输入的文本被替换为星号或项目符号,保护这些信息不被看到。