| 标题 | input按钮加背景IE7 IE6去黑框的方法 |
| 范文 | 背景可以采用简单的渐变或者高光背景然后repeat-x，边框直接设置border就可以了，似乎这种想法没有问题 IE9，IE8下没发现什么问题，IE7或者IE6会出现黑框 <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>input按钮加背景，IE7或者IE6会出现黑框</title> <style type="text/css"> <!-- .hk { height:22px; border:#999 1px solid; background:#E5E5E5 url(pn.png) repeat-x 0 0; cursor:pointer; } --> </style> </head> <body> <input type="submit" name="Submit" value="登陆" /> </body> </html> 解决方法： 1、如果设置border:none，也就是说不要border，那么这种黑框就没有了，所以有种解决办法是直接把框写死到背景上，然后去除border，即设置border:none。这个按钮样式的背景罗列。这种办法的缺点想必大家都清楚，就是灵活性差了点，有多少size的按钮就要准备多少size的背景 2、input按钮去除框线（border:none），然后input外面套上label，border写到label上，由于input被去除了border，所以不会出现黑框，同时外面的label有border，所以用户可以看到正常的框线，当然由于label的特性，你点击label的时候也等于点击了input按钮，哦，对了，为了模拟得更好一点，你可以设置他们的cursor为pointer <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>input按钮加背景，解决IE7或者IE6会出现黑框</title> <style type="text/css"> <!-- .pn { height:22px; border:none; background:#E5E5E5 url(pn.png) repeat-x 0 0; cursor:pointer; } .l_pn { display:block; border:#999 1px solid; } --> </style> </head> <body> <label> <input type="submit" name="Submit" value="登陆" /> </label> </body> </html> |
| 随便看 |
|
在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板，是学习及工作的有利工具。