ナビゲーションバーのカートアイテムの横にカートの画像を追加します。 cssだけを使ってこれを行う方法はありますか？私は多分：{}の後のどこかで動作すると思った。ここでcssのみを使用してナビゲーション内にカートの画像を追加するにはどうすればよいですか？
は、自分のサイトへのリンクです：事前にhttp://poloniafoods.weebly.com/store/c1/Featured_Products.html
おかげで、 ジャスティン。
afterタグをcart li要素に追加できます。 URLのコンテンツを使用して、画像の絶対パスを指定します。あなたの望む結果に応じて、サイズと位置を決めて遊んでください。
.wsite-nav-cart:after {
content: url('http://placehold.it/50');
position: absolute;
right: 0;
top: 0;
height: 10px;
width: 10px;
}
フォントの素晴らしいアイコンを使用する最も簡単な方法です。必要なときはいつでも、このコードを使用してください。
<i class="fa fa-shopping-cart" aria-hidden="true"></i>
カートのサイズを大きくしたい場合は、追加のクラスを追加するだけです。fa-2x
そして、あなたはフォントのすばらしいアイコンのcdnを使用する必要があります。
ちょうど彼らのウェブサイトに行くと、あなたはcdnを取得します。下記のスクリプトタグのような<html>タグの前に、このように追加してください。
<script src="https://use.fontawesome.com/someUniqueId.js"></script>
確かに、あなたはCSSで背景画像を使用することができます。
など。
#wsite-nav-cart-a {
position: relative;
background: url(http://www.clker.com/cliparts/U/D/n/G/6/h/white-shopping-cart-md.png) 2px 8px no-repeat;
background-size: 20px;
padding-left: 30px;
}
このIDを使用するのではなく、クラスを作成することをお勧めします。
動作した後、またはCSSバックグラウンドとして実行できます。 – Vcasso
少なくともこれを自分でコード化しようとします。スタックオーバーフローはコードを書くサービスではありません。私はいくつか[**追加の研究**]を行うことをお勧めします（http://meta.stackoverflow.com/questions/261592/how-much-research-effort-is-expected-of-stack-overflow-users） Googleを介して、またはSOを検索して、試みてください。それでも問題が解決しない場合は、**あなたのコード**に戻って、あなたが試したこととそれがうまくいかなかった理由を説明してください。 –
同時に、このQ＆Aは初心者のコーダーにとって非常に役立ちます。 – justinpees