0

既存のプロジェクトにトラベル アドバイザー ウィジェットを追加するよう依頼されました。問題は、スタイリングの方法が見つからないことです。Google での検索は否定的であることが判明し、自分でスタイルを変更するためにさまざまな方法を試しましたが、毎回どこにも行きません。

(開発者ツールを使用して) スクリプトが呼び出されたときに、スクリプトが以下のコード内に他の div タグを追加しているように見えます。スタイルを設定する必要があるのは、これらの新しく追加された div です。

何か案は?

<div id="TA_linkingWidgetWAR281" class="TA_linkingWidgetWAR">
  <ul id="7vEu3EbbE54" class="TA_links I3eKq4As">
    <li id="P1W6bWTQjEmY" class="M0QRzat">
      Write a review of <a target="_blank" href="http://www.tripadvisor.co.uk/Restaurant_Review-g1217951-d2315832-Reviews-Peking_Chinese_Takeaway-Bradley_Stoke_Gloucestershire_England.html">Peking Chinese Takeaway</a>
    </li>
  </ul>
</div>

<script src="http://www.jscache.com/wejs?wtype=linkingWidgetWAR&amp;uniq=281&amp;locationId=2315832&amp;lang=en_UK&amp;border=true">   </script>
4

2 に答える 2

5

これは簡単でしたよね?

ブラウザのインス​​ペクタを使用して、現在適用されているスタイルを確認し、自由に編集するだけです...

ここに画像の説明を入力

例として: http://jsbin.com/ivebet/2/edit

私がしなければならなかったのは:

#CDSWIDLNKR .widLNKRInner {
    margin: 30px  !important;
    padding: 14px 16px 12px !important;
    background-color: #bada55 !important;
}
ul li img {
    display: none;
}

ただし、注意してください。ウィジェット契約に違反しています。

2.1直接または間接的に、トリップアドバイザー ウィジェットまたはトリップアドバイザー ウェブサイトのコンテンツを変更、編集、追加、コピー、抽出したり、要約を作成したりすることはできません。特に、トリップアドバイザー ウィジェット以外の Web サイトにトリップアドバイザーの評価やレビューを表示することはできません。

于 2013-05-19T06:05:09.023 に答える
1

これはウィジェットであるため、あなたが話しているdivは、使用しているウィジェットを介して提供されます。ラッパーを作成してスタイリングする以外は、おそらく内部のスタイリングをほとんど制御できません。

しかし、これはあなたができることです。ブラウザで F-12 (たとえば chrome) を押して、作成された追加の div を調べます。これらの div/要素のクラスと ID に注意してください。

CSS でスタイルを設定するには、少なくとも場合によっては、スタイルに !important を使用して、プラグインのプロバイダーからのデフォルトをオーバーライドする必要があります。このような:

div.someclass { border: none !important; }

残念ながら、これはウィジェットを使用する代償であり、使いやすさはコントロールとのトレードオフです。

于 2013-05-19T06:04:21.867 に答える