質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

388閲覧

background-imageが表示されない

退会済みユーザー

退会済みユーザー

総合スコア0

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2018/01/11 11:57

background-imageで指定したsprite.pngが表示されません。
しかし、imgタグでは表示されます。

原因はどこにあるかお知恵を拝借したいです。

sprite.pngは以下です。
sprite.png

html

1<html> 2 3<head> 4 <style> 5 li { 6 background: pink; 7 position: relative; 8 padding: 0; 9 margin: 0; 10 } 11 12 li span:after { 13 content: ''; 14 position: absolute; 15 top: calc(50% - 6px); 16 right: 10px; 17 width: 6px; 18 height: 6px; 19 display: block; 20 background-image: url("sprite.png"); 21 } 22 </style> 23</head> 24 25<body> 26 27 <ul> 28 <li> 29 <span>xxx</span> aaaa<br>bbb 30 </li> 31 </ul> 32 <img src="sprite.png"/> 33</body> 34 35</html> 36 37

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

これじゃ、ダメですか?
あとは、画像を設置しているパスが間違っているかだと思います。

CSS

1background: url("sprite.png");

投稿2018/01/11 12:10

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2018/01/11 12:12

ありがとうございます!background-position: 0 -35px;の記述がなかったせいでした。
退会済みユーザー

退会済みユーザー

2018/01/11 12:12

ありがとうございます!background-position: 0 -35px;記述がなかったせいでした!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問