0

次のcssがあるとします。最近では、スピナーにフォントを使用するようになりました。だから今私がやりたいのは、背景をアイコンに置き換えることです。

.ui-autocomplete-loading {
  background: url('images/spinner.gif') no-repeat center right;
  background-origin: content-box;
  background-position: right;
}

これは、HTML 側で行うことです...

<i class="icon-spinner icon-spin"></i>

上部の背景を下部のアイコン スピナー定義に置き換える方法はありますか?

4

1 に答える 1

0

後者はPNG スプライトを使用します。私が正しければ、コードはTwitter BootStrapに付属するGlyphicons からのものです。

マークアップではアイコンという単語が使用されていますが、標準の背景を使用する場合とは形式や方法が異なることを意味しますが、以下はicon-arrow-downCSS を使用するコードです。

.icon-arrow-down {
    background-position: -312px -96px;
}
[class^="icon-"], [class*=" icon-"] {
    background-image: url("../img/glyphicons-halflings.png");
    background-position: 14px 14px;
    background-repeat: no-repeat;
    display: inline-block;
    height: 14px;
    line-height: 14px;
    margin-top: 1px;
    vertical-align: text-top;
    width: 14px;
}

sort_asc.png 画像をテーブルではなく独自のクラスに採用したい場合は、次のようなものを追加するだけです:

.sort-asc {
background: url('images/sort_asc.png') no-repeat center right; }
width:50px;
height:50px;
}
于 2013-03-29T13:16:27.560 に答える