0

私は次のことをしようとしています:

製品に多数の Magento 属性を設定しました。「色」という属性の横にアイコンを表示し、このアイコン/画像に alt タグを付けたいと考えています。私のテーマには、それぞれの属性が dt タグとして設定されているため、適用しようとしている CSS は次のとおりです。

dt[foo^="Color:"]{background: url(http://xyz.com/skin/frontend/default/default/images/warning.png) no-repeat 100% 0%;}

ここにマークアップがあります： <div class="white-box-inner">' '<dl class="attribute-list clearfix">``<dt class="first">Size:</dt>``<dd class="first">21</dd> <dt>Manufacturer:</dt>``<dd>Hat Designs</dd>``<dt>Color:</dt> <dd>Red</dd>``<dt>Fabric</dt> <dd>Felt</dd> </dl> </div>

  • ただし、これは表示したいアイコンを表示しません。
  • また、css を介してこのアイコンに alt タグを関連付ける方法もわかりません。テンプレートファイルを台無しにしたくありません。どんな助けでも大歓迎です。

ありがとう。-TM

4

1 に答える 1

0

マークアップから、コンテンツで要素を選択しようとしているように見えます。属性セレクターは属性によってのみ選択します。彼らはコンテンツで選択しません。

疑似クラスが存在する予定:contains()でしたが、仕様から削除されたため、CSS セレクターを使用してこれを行うことはできなくなりました。

ただし、 jQuery は を実装:contains()しているため、単純に jQuery を使用してクラスを追加し、そのクラスのスタイルを設定できます。

さらに、代替テキストまたはツールチップを CSS の背景画像に関連付けることはできません。これを実現するには、JavaScript ルートを経由する必要があります。

于 2012-05-24T20:33:02.547 に答える