私のギャラリーのdiv内の画像のスタイルを定義するための正しい方法は何ですか？

StackOverflow https://stackoverflow.com/questions/1095818

  •  11-09-2019
  •  | 
  •  

質問

私は「ギャラリー」のidを持つdiv要素を持っていると私はそれ内の画像のスタイルにしたいです。具体的には、私は彼らが互いの上に座っているので、下を除いて各画像に1pxの固体黄色の枠を与えたいと思うので、私は一番下に境界線を倍増する必要はありません。

ボーダー、ボーダースタイル、ボーダー幅：

私は何について混乱していると、別の境界線スタイル要素の間で選択する方法です。私はこれを試してみました。

div#gallery img
{
    border-width:1px;
    border-style:solid;
    border: solid yellow;
    border: 1px 1px 0px 1px;
}

私は上記のこのCSSで黄色の枠を得ることができたが、境界はより2ピクセルの境界線のように思える - それは非常に厚いです - と、それ以外にも、私が使用している構文は非常にエレガントに見えるしません。

エレガントに、より簡潔に/これを行う方法上の任意の提言を？

役に立ちましたか？

解決

私はこれが最善の方法だと思います：

border: 1px solid yellow;
border-bottom: none;

border を宣言するための構文はwidth style colorを行くと、すべての4つの境界線に影響を与えます。その後、あなたは border-bottom を宣言することで、何の境界線を使用していないに底に戻って上書きすることができますなしとしてます。

他のヒント

これを行うには間違った方法があります場合、私は本当に知りませんが、基本的にそれを行うための3つの方法があります：

の方法1 の

border-top: 1px solid yellow;
border-right: 1px solid yellow;
border-left: 1px solid yellow;

の方法2 の

border: 1px solid yellow;
border-bottom: 0;

の方法2 の

border: 1px solid yellow;
border-bottom: none;

私は方法2または方法3のいずれかを好むだろう。

（私は方法2と方法3を知っている基本的には同じですが、私はあなたが、あなたが好きなものを「なし」または「0」を選択することはできませんので、両方のソリューションを与えたいと思った）。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top