1

生徒のプロフィールにつながるリンクのリストがあるので、通常の丸い箇条書きではなく、スマイリー フェイスが必要でした。写真は14x14です。CSS のみを使用して箇条書きを表示するにはどうすればよいですか?

ul {
  list-style-type:url(smiley.tiff);
  text-transform:capitalize;
}
4

4 に答える 4

4

CSS 背景を使用します。list-style-image配置オプションがなく、見栄えがよくありません。レイアウトに応じてピクセル値を調整します。

li.icon {
     background-image:url(...);
     background-repeat:no-repeat;
     background-position:3px 3px;
     min-height:16px;
     padding-left:20px;
}

ところで - TIFF を使用しないでください (また、TIFF はすべてのブラウザでサポートされているわけではありません)。ファイルは巨大になる可能性があります。PNGに変換します。

于 2013-07-30T20:54:58.823 に答える
0

代わりにlist-style-image CSS ルールを使用してください。また、念のため URL を引用符で囲みます。ほとんどのブラウザーはそれらがなくても正しく解釈しますが、それは良い習慣です。

list-style-image: url('smiley.tiff');
于 2013-07-30T20:55:47.273 に答える
-3

font awesome を使用するだけで、list-style:none を作成し、font awesome アイコンをシンプルに使用できます Happy Coding :D

于 2014-08-11T13:30:37.893 に答える