0

「ディスプレイインライン」と「リストスタイル画像」を一緒に使用するためのいくつかの解決策があることがわかります（ディスプレイインラインまたはインラインブロックを使用する代わりにフローティング画像を残すなど）が、それらを一緒に使用する必要があります。

もう少し詳しく言うと：

データベースの記事の foreach ブロックを使用して、hadlines を指定したタグにリンクを作成し、完全に機能しています。（私は30以上のウェブサイトでテストしました。）

設計上の問題によると、今回はこれらのリンクをインラインで表示する必要があり、リストの箇条書きを指定された画像に変更する必要がある場合を除きます。

display: inline または display: inline-block を使用して list-style-image "without (!)" を使用すると、完全に正常に動作します。しかし、ご想像のとおり、それらは文字通りにリストされています。

この 2 つの CSS コードを一緒に使用する必要があります。ASP.NET MVC ではなく、HTML/CSS のサブジェクトに似ていることはわかっていますが、ASP.NET MVC プログラマーが答えを知っていれば、非常に助かります。

読んでくれてありがとう、助けてくれてありがとう...

4

1 に答える 1

1

それとは別に、lidisplay:inline-blockで指定する必要もあります。float:left

list-style-imageそれとは何の関係もありません。一緒に使用できます。

li { 
    display:inline-block;
    float:left;
    list-style-image:url(....
}

を指定して、代わりに background-image を使用することもできますlist-style-type:none。ただし、左パディングを提供する必要があります。

li { 
    list-style-type: none;
    display: inline-block;
    float: left;
    margin: 0px 24px;
    padding-left: 24px;
    background: url(http://placehold.it/16x16) no-repeat left center;
}
于 2013-08-02T14:50:27.647 に答える