タグ付けされた質問 「background-image」

この質問は以前に尋ねられましたが、解決策は私の場合には適用されません。特定の背景画像がページに不可欠であるため、それらを確実に印刷したい。（CSSスプライトとして使用されている画像がいくつかあるため、ページ内の画像ではありません。） 同じ質問に対する別の解決策はlist-style-image、を使用することを提案しています。これは、アイコンごとに異なる画像がある場合にのみ機能し、CSSスプライトは使用できません。 アイコンをインラインで配置した別のページを作成する以外に、別の解決策はありますか？

102 css  printing  background-image 

コンテンツスクリプト機能を使用してウェブサイトを変更するシンプルなChrome拡張機能があります。より具体的にはbackground-image、上記のウェブサイト。 何らかの理由で、拡張機能にパックされていても、ローカル画像を使用できないようです。 body { background: #000 url('image.jpg') !important; background-repeat: repeat !important; } それだけです。最も単純なCSSですが、機能しません。ブラウザは画像をロードしません。

98 css  google-chrome-extension  background-image 

セレクターを使用してボタンを作成しようとしていますが、ボタンには次の状態があります。 有効/無効 押された/押されていない 上記の状態によると。ボタンを操作する必要があります： テキストの色 背景画像 ボタンは無効になっているところから始まるので、無効なtextColorと無効なボタンの背景が必要です。しかし、デフォルトのtextColor（スタイルで指定）が表示され、背景画像は表示されません。 これが私のセレクタbutton_selector.xmlです <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="false" android:state_enabled="false" android:textColor="#9D9FA2" android:drawable="@drawable/button" /> <item android:state_pressed="true" android:state_enabled="true" android:drawable="@drawable/button_pressed"/> <item android:state_pressed="true" android:state_enabled="false" android:textColor="#9D9FA2" android:drawable="@drawable/button"/> <item android:state_pressed="false" android:state_enabled="true" android:drawable="@drawable/button"/> </selector> そして、ここに私のlayout.xmlの私のボタン宣言があります <Button android:id="@+id/reserve_button" android:text="@string/reserve_button" android:layout_width="120dp" android:layout_height="40dp" android:layout_marginTop="10dp" android:layout_marginLeft="20dp" android:paddingRight="15dp" android:layout_gravity="left" style="@style/buttonStyle" android:background="@drawable/button_selector" /> そして最後にこれが私のスタイルです（私のデフォルトのtextColorが設定されています） <?xml version="1.0" encoding="utf-8"?> …

97 android  xml  button  selector  background-image 

imgsrcset属性付きは、レスポンシブ画像を作成するための優れた方法のように見えます。cssbackground-imageプロパティで機能する同等の構文はありますか？ HTML <img src="small.jpg" srcset="medium.jpg 1000w, large.jpg 2000w" alt="yah"> CSS .mycontainer { background: url(?something goes here?); }

91 html  css  background-image  srcset 

私は現在、会社のモバイルランディングページに取り組んでいます。これは本当に基本的なレイアウトですが、ヘッダーの下には常に100％の幅になる製品の画像があります（デザインは常に端から端まで行くことを示しています）。画面の幅に応じて、画像の高さは明らかにそれに応じて調整されます。私はもともとimg（CSS幅100％）でこれを行いましたが、うまく機能しましたが、メディアクエリを使用して、さまざまな解像度に基づいてさまざまな画像を提供したいと思いました。たとえば、同じ画像の大きなバージョン。CSSでimgsrcを変更できないことはわかっているので、HTMLのimgタグではなく、画像にCSSの背景を使用する必要があると考えました。 背景画像のdivは背景を表示するために幅と高さの両方を必要とするため、これを適切に機能させることができないようです。明らかに「幅：100％」を使用できますが、高さには何を使用しますか？150pxのようなランダムな固定高さを設定すると、画像の上部150pxが表示されますが、固定高さがないため、これは解決策ではありません。私は遊びをして、高さがあれば（150pxでテスト）、「background-size：100％」を使用して画像をdivに正しく合わせることができることを発見しました。このプロジェクトはモバイルのみを対象としているため、最新のCSS3を使用できます。 以下に大まかな例を追加しました。インラインスタイルを失礼しますが、質問をもう少し明確にするための基本的な例を示したいと思いました。 <div id="image-container"> <div id="image" style="background: url(image.jpg) no-repeat; width: 100%; height: 150px; background-size: 100%;"></div> </div> コンテナdivにページ全体に基づいてパーセンテージの高さを指定する必要があるのでしょうか、それともこれを完全に間違って見ているのでしょうか。 また、CSSの背景がこれを行うための最良の方法だと思いますか？たぶん、デバイス/画面の幅に基づいて異なるimgタグを提供する手法があります。一般的な考え方は、ランディングページテンプレートはさまざまな製品画像で何度も使用されるため、これを可能な限り最善の方法で開発する必要があります。 申し訳ありませんが、これは少し時間がかかりますが、このプロジェクトから次のプロジェクトへと行ったり来たりしているので、この小さなことをやりたいと思います。よろしくお願いします。よろしく

89 html  css  background-image  responsive  responsive-images 

HTML要素（body、divなど）の背景画像を取得して、幅と高さ全体を拡大しようとしています。 運が悪い。それは可能ですか、それとも背景画像以外の方法で行う必要がありますか？ 私の現在のCSSは： body { background-position: left top; background-image: url(_images/home.jpg); background-repeat: no-repeat; } 前もって感謝します。 編集：私はガブリエルの提案でCSSを維持することに熱心ではないので、代わりにページのレイアウトを変更します。しかし、それが最良の答えのように思われるので、そのようにマークします。

88 html  css  background-image 

ボタンをクリックすると、アラートが表示されます。 background-imageURL送信します#div1。 出来ますか？

88 jquery  url  html  background-image 

私が持っているとしましょう <div class="myDiv">Hi there</div> 私は入れたいbackground-imageとそれを与えるopacityのを0.5-しかし、私は私が書かれているテキストが（完全に不透明になりますことをしたいです1）。 このようにCSSを書くとしたら .myDiv { opacity:0.5 } すべてが不透明度が低くなります–そして私はそれを望んでいません。 だから私の質問は-完全な不透明度のテキストで低不透明度の背景画像を取得するにはどうすればよいですか？

86 html  css  background  background-image 

JSで背景を動的に変更したいのですが、画像のセットはbase64でエンコードされています。私は試してみます： document.getElementById("bg_image").style.backgroundImage = "url('http://amigo.com/300107-2853.jpg')"; 完璧な結果で、 それでも私は同じことをすることができません： document.getElementById("bg_image").style.backgroundImage = "url('data:image/png;base64,iVBORw0KGgoAAAAAAAAyCAYAAAAUYybjAAAgAElE...')"; また document.getElementById("bg_image").style.backgroundImage = "data:image/png;base64,iVBORw0KGgoAAAAAAAAyCAYAAAAUYybjAAAgAElE..."; それを行う方法はありますか？

84 javascript  base64  background-image