<iframe name="google_ads_frame" marginwidth="0" marginheight="0" src="http://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-4490194096475053&dt=1228531115328&lmt=1228528446&prev_slotnames=1891601125&output=html&slotname=3685991503&correlator=1228531115296&url=http%3A%2F%2Fwww.corange.cn%2Farchives%2F2008%2F10%2F1814.html&ea=0&ref=http%3A%2F%2Fwww.corange.cn%2Fhtml%2Fcorange__98.html&frm=0&ga_vid=1689705203.1228531115&ga_sid=1228531115&ga_hid=106946996&flash=9.0.124.0&u_h=768&u_w=1024&u_ah=738&u_aw=1024&u_cd=32&u_tz=480&u_java=true&dtd=15" frameborder="0" width="300" scrolling="no" height="250" allowtransparency></iframe>
,初始状态:
当鼠标点进去写东西的时候,如下图:
默认用了一个bg图片,在文本框获得一次焦点后把背景图片去掉了,后来再失去焦点的时候用的是第三个样式。
代码是copy下来的,图片路径修改成了绝对路径。
/*你好,你现在看的CSS是偶写的,抄袭的时候记得改名字*//*linstyle.cn by 香水 06-07*//****** General Styles ******/
.fab{width:440px;height:100px;font-size:12px;padding:3px;background: #f8f9ff url(
http://www.linstyle.cn/website/template/linstyle/images/linstyle/footer.gif
) no-repeat 0 -222px;border: 1px solid #c4c9fd;color:#6C63A3}
.fabt{width:440px;height:100px;font-size:12px;padding:3px;border:1px solid #f7ca06;background:#fffbca;color:#cb6a24}
.fabtt{width:440px;height:100px;font-size:12px;padding:3px;background: #f8f9ff;border: 1px solid #c4c9fd;color:#6C63A3}
另外 以前发布过 textarea 里 加背景图:
效果如下:
分享到:
相关推荐
在"效果超酷的textarea的输入字数限提示"这个压缩包中,可能就包含了实现这些效果的代码示例和CSS样式。 这个功能在许多实际场景中都非常有用,比如论坛发帖、在线留言、博客写作等。它不仅能够帮助用户避免输入...
在网页设计中,表单是用户与网站交互的重要部分,其中textarea元素用于收集用户输入的多行文本。本文档“表单美化之textarea文本域背景的美化.rar”着重于提升textarea的视觉效果,以增强用户体验。我们将探讨如何...
为了提供更好的用户体验,尤其是当需要限制用户输入的字数时,一个效果超酷的`textarea`字数限制提示可以极大地提升界面的交互性和专业性。本文将深入探讨如何通过CSS美化`textarea`,并实现动态的字数限制功能。 ...
这些事件可以用于实现各种交互效果,如悬浮提示、鼠标悬停高亮等。 例如,要监听`textarea`的鼠标移动事件,可以添加`onmousemove`事件: ```javascript <textarea ... onmousemove="handleMouseMove(event)"></...
**jQuery高亮插件——实现文本高亮与关键词查找** ...在网页开发中,有时我们需要对页面上的特定文本或者关键词进行高亮显示,以突出其重要性或...在全文检索应用中,结合关键词高亮,能更直观地展示结果,增强交互效果。
本文将详细讲解如何利用 `textarea` 的焦点事件实现特定的功能,包括获取焦点、清空内容、失去焦点时的提示效果。 首先,`textarea` 的焦点事件通常涉及到 `onfocus` 和 `onblur` 两个JavaScript事件处理器。`...
本示例中,我们将探讨如何使用jQuery实现textarea文本框的字数限制功能,并实时提示用户输入的字符数量。 首先,让我们了解jQuery的基本概念。jQuery通过一个"$"符号作为入口,提供了一种简洁的方式来选择DOM元素、...
JavaScript是一种广泛使用的客户端脚本语言,可以在用户与网页交互时执行,提供动态效果和验证。以下是一个简单的示例,展示了如何限制`textarea`的最大输入字数: ```html <!DOCTYPE html> 限制textarea输入...
这将在`textarea`中显示一个淡色的提示文字,当用户开始输入时会自动消失。 总结,`<textarea>` 控件是HTML表单中用于收集多行文本的重要元素,通过合理设置`cols`、`rows`属性以及应用CSS和JavaScript,我们可以...
在我们的场景中,我们需要使用可输入的消息提示框,要求使用 textarea 输入,并且附有长度校验。我们将使用 Vue 的组件来实现这个功能。 inputType 在我们的实现中,我们使用了 inputType 来定义输入框的类型。...
而charCount这个插件则是基于jQuery的一个实用工具,它实时监测textarea中的字符数,帮助开发者实现动态显示剩余字符数的效果,提升用户的输入体验。 要使用charCount插件,首先需要在页面中引入jQuery库和...
HTML5的`placeholder`属性是Web开发中一个非常实用的功能,它允许我们在输入框`<input>`或文本区域`<textarea>`中设置提示文本,这些文本会在用户未输入任何内容时显示,一但用户开始输入,提示文本就会自动消失。在...
本篇文章将深入探讨如何在ASP.NET后台实现文本框的提示文字效果,以及在用户交互时动态改变其颜色和行为。 首先,我们需要了解ASP.NET中的TextBox控件。TextBox是ASP.NET Web Forms中最基本的输入控件,用于接收...
根据标题“javascript之textarea打字机效果提示代码推荐”以及描述“非常不错的提示输入内容,动态的提示,给人亲切感”,我们可以得出以下需求: 1. **动态提示**:当用户聚焦在文本框时,能够自动显示提示信息。 2...
在这个场景下,我们可能会遇到一个需求:如何在`el-input`的`textarea`部分实现placeholder的换行,以提供更清晰的提示信息。 首先,让我们理解`placeholder`属性。在HTML中,`placeholder`属性用于设置输入框或...
在JavaScript的世界里,jQuery库以其简洁的API和强大的功能深受开发者喜爱。本示例"jQuery表单消息提示功能"着重于提升用户交互体验,通过利用jQuery的事件处理和DOM操作来实现表单验证和提示信息的动态显示。下面将...
标题 "页面右下脚提示效果(利用JQuery)" 指涉的是一个使用JQuery库实现的网页交互功能,具体是当用户输入标题和内容后,点击按钮,会在页面的右下角显示一个可操作的提示区域。这个提示区域具备最小化、最大化和关闭...
这些功能对于实现 `@` 提示效果至关重要。要查看完整的实现效果,可以通过下载演示文件并进行本地测试。 总的来说,`@符号` 的用户名提示功能是提升社交媒体用户体验的关键特性,通过JavaScript和DOM操作,我们可以...