2

以下のスクリプト (およびhttp://jsbin.com/enOxEya/1/にもある) に対する私の意図は、右の境界線を削除することです。

ただし、FF、Chrome、および IE の場合は、左と上の境界線が太字になります。

さらに、FF の場合は下枠を削除し、Chrome と IE の場合は下枠に影を付けます。

各ブラウザの画像を参照してください (すべてのブラウザはかなり最新です)

FFの結果

FFの結果

Chrome からの結果

Chrome からの結果

IE の結果

IE の結果

上、下、左の境界線だけにボーダー スタイル none を使用すると、すべてのブラウザーで予期しない結果が発生します。

他の 3 つの境界線に影響を与えることなく、単一の境界線 (つまり、右側の境界線) を削除するにはどうすればよいですか?

<!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>
4

2 に答える 2

5

これを試してみてください、うまくいきます

交換するだけ

<style type='text/css'>
            #input2 {border-right-style:none}
        </style>

これとともに

<style type='text/css'>
            #input2 {border-style: solid none solid solid}
        </style>

これがお役に立てば幸いです。

于 2013-09-22T15:14:20.130 に答える
1

これを試して：

デモ

<!DOCTYPE html>
<html>
<head>
<title>Boarders</title>
<style type='text/css'>
#input2 {
    border: 1px solid #ABADB3;
    border-right: 0;
}
</style>
</head>
<body>
<input id="input1" />
<br />
<br />
<input id="input2" />
</body>
</html>
于 2013-09-22T15:16:33.420 に答える