CSS巧用expression来区分只读文本框

2016-02-19 21:32 3 1 收藏

想不想get新技能酷炫一下,今天图老师小编就跟大家分享个简单的CSS巧用expression来区分只读文本框教程,一起来看看吧!超容易上手~

【 tulaoshi.com - Web开发 】

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

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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

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

来源:http://www.tulaoshi.com/n/20160219/1626432.html

延伸阅读
标签: Web开发
一、按钮样式 .buttoncss { font-family: "tahoma", "宋体"; /*www.52css.com*/ font-size:9pt; color: #003399; border: 1px #003399 solid; color:#006699; border-bottom: #93bee2 1px solid; border-left: #93bee2 1px solid; border-right: #93bee2 1px solid; border-top: #93bee2 1px sol...
气泡对话框在网页中经常用于说明提示等功能,可以形象生动的现实一些需要用户注意的文字与内容,本文介绍仅用CSS来实现这种简单的网页效果。 气泡状文本框,是一种很生动的网页设计手段。 它可以用来表示用户的发言。 也可以用来作为特定信息的提示符。 DVD租借网站Netflix,还用它显示碟片的详细信息。 制作CSS气泡框的传统方法...
标签: Web开发
气泡对话框在网页中经常用于说明提示等功能,可以形象生动的现实一些需要用户注意的文字与内容,本文介绍仅用CSS来实现这种简单的网页效果。 气泡状文本框,是一种很生动的网页设计手段。 它可以用来表示用户的发言。 也可以用来作为特定信息的提示符。 DVD租借网站Netflix,还用它显示碟片的详细信息。 ===================...
wps演示怎么添加文本框   1、首先我们打开wps演示,点击插入==文本框 我们可以根据自己需要,然后我们选择自己想要的类型文本框 WPS文字怎么关闭拼写检查   1、首先打开wps,选择wps文字--选项,进入设置页面或者点击下拉工具选择拼写检查 2、再设置页面选项拼写选项卡。在拼写选项卡中选择勾选掉输...
wps演示怎么添加文本框?   1、首先我们打开wps演示,点击插入==文本框 我们可以根据自己需要,然后我们选择自己想要的类型文本框 wps文字标尺怎么显示   1、其实方法很简单,首先我们打开WPS,默认我们是不显示标尺的 2、点击tuLaoShi.com视图菜单===标尺 这样我们标尺就出来啦 Word和WPS中通...

经验教程

533

收藏

31
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部