2016-07-11 11 views
0

のリストスタイルのタイプに画像を追加し、誰かがコードを以下にUL李にリストスタイルの画像を表示する方法を私を導いてください:代わりのlist-style-画像

私はリスト-STYLE-で画像を表示する必要があります私のページ内にと入力してください。リストスタイルイメージは機能しません。ここで

は、リストスタイル画像

ul.footerlist {padding-left:20px; list-style-image:url('../../images/li.png');} 
ul.footerlist li{line-height:24px; } 
ul.footerlist li a{color:#303030; } 
ul.footerlist li a:hover{color:#0099cc; text-decoration:none;} 

ul.footerlist {padding-left:20px; list-style-type:url('https://mdn.mozillademos.org/files/11981/starsolid.gif');} 
 
ul.footerlist li{line-height:24px; } 
 
ul.footerlist li a{color:#303030; } 
 
ul.footerlist li a:hover{color:#0099cc; text-decoration:none;}
<ul class="footerlist go-right go-text-right"> 
 
            <li>1</li> 
 
            <li>2</li> 
 
            <li>3</li> 
 
            <li>4</li> 
 
            <li>5</li> 
 

 
           </ul>

答えて

0

リストスタイルのタイプは、カスタムイメージは表示されませんに基づいて、私のCSSです。ドキュメントには、一般的な図形/文字などしか表示されていないようです(http://www.w3schools.com/cssref/pr_list-style-type.asp

リストスタイルのイメージを再度取得するようにしてください。

あなたの画像が../../images/li.pngにアップロードされていることを確認できましたか?相対パスの問題や権限の問題はありますか?


返信2:

コードのこの作品は、正常に動作するようです。同意しますか?

ul.footerlist {padding-left:20px; list-style-image:url('https://mdn.mozillademos.org/files/11981/starsolid.gif');} 
 
ul.footerlist li{line-height:24px; } 
 
ul.footerlist li a{color:#303030; } 
 
ul.footerlist li a:hover{color:#0099cc; text-decoration:none;}
<ul class="footerlist go-right go-text-right"> 
 
            <li>1</li> 
 
            <li>2</li> 
 
            <li>3</li> 
 
            <li>4</li> 
 
            <li>5</li> 
 

 
           </ul>

+0

でも、私はそれをダブルチェックするはいイムは確か。 – user6276867

+0

mozillaイメージのコードを編集しましたが、うまくいくようです。上記の返信2を参照してください。 – Blank

+0

W3Schoolsは「ドキュメント」ではありません。 [This](https://www.w3.org/TR/html5/)と[this](https://www.w3.org/Style/CSS/Overview.en.html)はドキュメントです。具体的には、https://www.w3.org/TR/CSS2/generate.html#propdef-list-style-type –

関連する問題