背景画像と背景色の問題_html/css_WEB-ITnose

昨日入力ボックスを作成していたときに、いくつかの問題が発生しました。最初にレンダリングを示します。

レンダリングは次のとおりです。

ソースコードは次のとおりです。

#search-input{

border: none;

border -radius: 6px;

身長: 35px;

幅: 62%;

余白: 3%;

フォントサイズ: 600;中央;

背景色: #d7d7d9;

背景: url(../images/search.png) 繰り返しなし 3% 中央;

パディング: 0 8%;

}

レンダリングは次のとおりです:

分析: フォーラムを閲覧した後、背景の書き方が非常に重要であることがわかりました。背景画像や背景色を付けるには書き方に注意する必要があります。最初に背景色を設定し、次に背景画像を設定すると、背景色が背景画像によって上書きされます。

したがって、次のように書くことができます:

背景: #d7d7d9 url(../images/search.png) no-repeat 3% center;

効果は次のとおりです:

それ。 。