打印

[讨论] input的CSS样式,有没有分别对应type=text,submit,chekbox...的写法?

通常定义CSS时,书写input 规定宽度,可以使收集数据的页面显得非常整齐.
但如果表单内包含checkbox时,就需要为它单独定义一个样式,把class="name"与checkbox捆绑,非常麻烦.

有没有一种写法,可以分别定义全站input分别对应type="text",type="submit",type="chekbox"....等等的样式呢?
我看苏沈小雨的样式手册有"INPUT type=buttonINPUT type=fileINPUT type=passwordINPUT type=resetINPUT type=submitINPUT type=text"的应用单,但具体怎么用似乎没说.

有知道的好心人,指导一下吧:)
查到这个写法:input[type=text] ,Firefox有效,但IE不支持,对么?

 提示:您可以先修改部分代码再运行
出处:http://cf-bill.blogspot.com/2005 ... petext-webpage.html
你是说对应type定义CSS? 这个属性选择符目前IE不支持

 提示:您可以先修改部分代码再运行
[ 本帖最后由 snwebsite 于 2006-9-19 16:15 编辑 ]

TOP

谢谢回复:)

我是想知道,怎么定义input的样式表,才能让下面这两个东东的宽度等于20px?
<input type="radio" />
<input type="checkbox"  />

而input的其它type比如<input type="text" />的宽度为200px?

当然,下面的写法IE和FF都是支持的,但我嫌它麻烦,想找全局都支持,不需要再特意指定Input样式的办法:

 提示:您可以先修改部分代码再运行
[ 本帖最后由 hutuu 于 2006-9-19 16:32 编辑 ]

TOP



 提示:您可以先修改部分代码再运行

TOP

谢谢

TOP

再问问:)

input {
width:expression(this.type=="checkbox"?"20px":"style");
width:expression(this.type=="radio"?"20px":"style");
}

这两行有没有办法合成一行写?:)

TOP

找到了,呵呵.

input {
       width: expression((this.type=="checkbox" || this.type=="radio") ?"20px":"style");
}

TOP

input的CSS样式,有没有分别对应type=text,submit,chekbox...的写法? 之 behavior

cssfile:
input {
       behavior: url(bindbutton.htc);
      }

htcfile:
<PUBLIC:COMPONENT lightWeight=true>
<PUBLIC:ATTACH EVENT="oncontentready" ONEVENT="load()" />
<PUBLIC:ATTACH EVENT="onmouseout"  ONEVENT="mouseout()" />
<PUBLIC:ATTACH EVENT="onmouseover"  ONEVENT="mousemove()" />
<PUBLIC:ATTACH EVENT="onmousedown" ONEVENT="mousedown()" />
<PUBLIC:ATTACH EVENT="onmouseup" ONEVENT="mouseup()" />
<PUBLIC:PROPERTY NAME="direction" />

<SCRIPT LANGUAGE="JScript">
function load()
{
       if ((element.tagName == 'INPUT' && (element.type == 'button' || element.type == 'submit' || element.type == 'reset')) || (element.tagName == 'BUTTON'))
       {
              element.style['background'] = '....';
       }
       element.style.border = ((element.type=='checkbox'||element.type=='radio')?'none':'1px double #888888');
}

function setImage(sImg)
{
       if (bSet)
       {
              //element.style['background'] = 'URL('+ sImg +')';
       }
}

function mouseout() { setImage(aNormal[iDir]); try{element.style.MozOpacity=0.8;element.filters.alpha.opacity=80;}catch(e){}}
function mousemove() { setImage(aOver[iDir]); try{element.style.MozOpacity=1;element.filters.alpha.opacity=100;}catch(e){}}
function mousedown() { setImage(aClick[iDir]); }
function mouseup() { setImage(aNormal[iDir]); }

</SCRIPT>
</PUBLIC:COMPONENT>
IMK.MARK

TOP

楼上东西非常有用!收藏了!
长沙网站建设,QQ258754,258754.cn

TOP

input {
       border:expression(this.type=="text"?"1px solid red":"style");


为什么我用了expression后,加申明就会CSS无效, 不加是正确的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
卖山核桃的,http://shop33992838.taobao.com/

TOP