当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > 区分只读文本框和普通文本框的背景色

HTML/XHTML教程
制作三维表格效果
正确使用XHTML的冒险以及解决办法
在线播放器代码大全
在html文件引入其它html文件的几种方法
用好超级链接标记—A
用meta标签来增强网页功能
页边距的设定技巧(HTML)
为你的网页做出电影的过场效果
网站web标准测试
网页制作中的小秘诀
网页设计:一种细腻的导航效果的制作方法
鼠标在文本上移动时层的显示与消失
使用Web标准建站第9天:CSS布局入门
使用Web标准建站第8天:CSS布局入门
HTML语言剖析(七)表格标记
HTML语言剖析(八)表单标记
HTML语言剖析(九)图形标记
HTML语言剖析(十)链接标记
HTML语言剖析(十一)排版标记
HTML语言剖析(十二)多媒体标记

HTML/XHTML教程 中的 区分只读文本框和普通文本框的背景色


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 110 ::
收藏到网摘: n/a

        对于文本框,只读状态下和普通状态下,浏览器对其并没有做什么特殊的标记,表面看来,效果是一样的,这样,对用户来说,易用性并不是很高.

        当然,我们可以改变只读文本框的背景颜色来加以区分,这个时候就需要程序员自己判断这个文本框是不是只读,然后再引入相应的css,无疑加大了工作量.

          这里,使用expression来提供一种解决方案,只需要每个页面引入这个css即可,其它的都由程序自己判断,如下:

<style>
input{background-color:expression((this.readOnly && this.readOnly==true)?"#cccccc":"")}
</style>
<INPUT TYPE="text" NAME="">
<INPUT TYPE="text" NAME="" readonly>
<INPUT TYPE="text" NAME="">
<INPUT TYPE="text" NAME="" readonly>