0

JQuery Mobile を使用してモバイル Web アプリケーションを作成しています。下部には、ある種のナビゲーション メニューがあります。ここにHTMLがあります

<ul data-role="listview">
    <li data-icon="arrow-u"><a href="#top" class="top" data-ajax="false">Top</a></li>
    <li><a href="~PROBE(201)~" data-transition="slide">Menu</a></li>
    <li><a href="~PROBE(208)~" data-transition="slide">Contacten</a></li>
    <li><a href="~PROBE(206)~" data-transition="slide">Klanten</a></li>
    <li><a href="~PROBE(207)~" data-transition="slide">Planning</a></li>
</ul>

ここで、右側に最初の listItem が必要です。だから私はcssクラス「トップ」を作りました

.top{
    text-align:right; 
    padding-right:35px;
}

しかし、何らかの理由で、この CSS クラスを使用しません。誰でも助けることができますか？

4

3 に答える 3

1

の代わりにtopクラスを適用しています。ali

アップデート

スタイリングがオーバーライドされると、それをオーバーライドするルールの特異性よりも高くなるまで、セレクターのCSS 特異性を高める必要があります。私はあなたのDOMについてあまり知らないので、私があなたに与えることができる最高のものは次のとおりです。

ul li.top{
    text-align:right; 
    padding-right:35px;
}

しかし、それだけでは不十分かもしれません。CSS-specificity に関する記事を参照してください。具体性の計算方法に関する部分があります。

于 2012-04-16T07:38:53.623 に答える
1

そのようにしてみてください：

ul li a.top{
    text-align:right; 
    padding-right:35px;
}

またはそのような：

ul li:first-of-type a{
    text-align:right; 
    padding-right:35px;
}
于 2012-04-16T09:00:48.953 に答える
0

特定のケースでは、オーバーライドが少しトリッキーであることを発見しました。このようなことをしなければならないかもしれません。一部のブラウザー モバイルと Web は、私が期待したようにオーバーライドを取得しません。最終結果自分のスタイルが確実に適用されるようにするために重要なものを使用する必要があります。これをどのように使用するか、どこで使用するかに注意してください。

ul li.top{
    text-align:right !important; 
    padding-right:35px !important;
}
于 2012-04-16T13:30:22.980 に答える