仅删除输入元素上的一个边框,而不影响其他边框 [英] Remove only one border on input element and not effect the other borders
问题描述
我打算下面的脚本(也位于 http://jsbin.com/enOxEya/1) / )只是为了删除右边框。
但是,对于FF,Chrome和IE, >
此外,对于FF,它删除底部边框,而对于Chrome和IE,它会底部边框。
FF的搜索结果
Chrome的结果
来自IE的结果
使用边框样式无仅限于顶部,底部和左侧边框也会对所有浏览器产生意外结果。
如何只删除单个边框(即右边的那个)而不影响其他三个边界?
<!DOCTYPE html&
< html>
< head>
< title>寄宿生< / title>
< style type ='text / css'>
#input2 {border-right-style:none}
< / style>
< / head>
< body>
< input id =input1/>
< br />
< br />
< input id =input2/>
< / body>
< / html>
试试这个,效果不错
只需替换
< style type ='text / css'
#input2 {border-right-style:none}
< / style>
$ b code>< style type ='text / css'>
#input2 {border-style:solid none solid solid}
< / style>
希望这有助于你。
My intention for the script below (and also located at http://jsbin.com/enOxEya/1/) is just to remove the right border.
For FF, Chrome and IE, however, it makes the left and top border bold.
Furthermore, for FF, it removes the bottom border, and for Chrome and IE, it shades the bottom border.
See images for each browser (all browsers are fairly up to date)
Results from FF
Results from Chrome
Results from IE
Using border style none to just the top, bottom, and left border also produces unexpected results for all browsers.
How do I just remove a single border (i.e. the right one) without effecting the other three borders?
<!DOCTYPE html>
<html>
<head>
<title>Boarders</title>
<style type='text/css'>
#input2 {border-right-style:none}
</style>
</head>
<body>
<input id="input1" />
<br />
<br />
<input id="input2" />
</body>
</html>
Try this,it works fine
just replace
<style type='text/css'>
#input2 {border-right-style:none}
</style>
with this
<style type='text/css'>
#input2 {border-style: solid none solid solid}
</style>
hope this helps you.
这篇关于仅删除输入元素上的一个边框,而不影响其他边框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!