背景位置と繰り返し

私はタイル張りの画像である背景に "透けて見える"偽の透明なフォームフィールドを作成しようとしています（もちろん入力とページの背景の間の多数のdivを「表示」しています）。私がここにいます：背景位置と繰り返し

div#searchbox, div#mailing_list ul li.fields,div#product div.info input.text { 
    border:1px solid #707070; 
    background:url(../_images/fade_bg.jpg) 0 0 repeat; 
} 
input#search { 
    background-position:-715px -163px; 
} 
input#name { 
    background-position:-134px -888px; 
} 
input#duhlyh-duhlyh { 
    background-position:-134px -926px; 
}

これは、バックグラウンド位置のプロパティが何もしていないことを除いて、これは期待どおりに動作します。私はそれらを取り除き、変更し、何も起こらない。私はそれが繰り返しの背景だという事実と関係があると推測しています。位置の値は、背景自体が始まるボディからの要素オフセットです。これらを並べる方法はありますか？

出典

2011-02-03 Thomas McCabe

http://jsfiddle.netのようなものに例を表示できますか？ありがとう。 – alex

JavaScriptに関連するものはありません。これらのフィールドは静的に配置されます。彼らはいつも同じ場所にいるでしょう。 jQuery offset（）からオフセットを取り除きましたが、値を取得した後でjQuery/jsを使用する必要はありません。 –

Javascriptは、JSFiddleが使用されている機能の1/3にすぎません。 :) – drudge

inputsはCSSを使用して非常に難しいです。

しかし、あなたが試みることができるもの（Firefoxで動作する）は、入力から背景画像を削除し、親の背景が表示されるようにそれらにbackground:transparentを与えることです。

出典

2011-02-04 02:00:01 jeroen

は時々、何が起こることは、いくつかのプロパティが上書きされるため、このコードは、それぞれの親要素と

input#search { background-position:-715px -163px; } input#name { background-position:-134px -888px; } input#duhlyh-duhlyh { background-position:-134px -926px; }

のためのCSSのネストを使用してみてください。その場合は、CSSネストを使用して動作させることができます

出典

2011-02-04 04:29:09 Mahima

答えて

関連する問題