web-dev-qa-db-ja.com

CSSテキスト変換をオーバーライドする

私はすべてのテキストを大文字に変換する次のCSSを使用しています：

.taxtabs {
font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
font-size: .8em;
width: inherit;
text-align:center;
text-transform: uppercase;
border-collapse: collapse;
}

ここで私がしたいのは、このCSSをオーバーライドし、特定のテキストを小文字にできるようにすることです。どうすればいいですか？おそらく、ある種のインラインCSSを使用していますか？ありがとう。

overridinginlinecss
16
DanielAttard

おそらく、text-transformを持たないクラスを作成する方が良いでしょう。

.normal {
    text-transform: none;
}

<div class="taxtabs">
... <span class="normal">this text is not uppercase</span> ...
</div>
31
U-DON

上限を設定したくない要素のクラスを作成し、その中にtext-transform: none !important;を配置します。レイアウトがわからないので、適切な尺度として!importantを配置します（たとえば、要素にtexttabsクラスとoverrideクラスの両方がある場合）。

.override {
    text-transform: none !important;
}
7
ThinkingStiff

選択した.textabsにlowercaseという新しいクラスを追加して、次のように定義できるようにします。

.textabs.lowercase { text-transform: lowercase; }
1
sczizzo

何をしたいのかわからない

一部のテキストを小文字にするだけの場合

新しいクラスを追加するか、上記のcssを継承する必要があります

から

<label class="taxtabs">text</label>

に

<label class="taxtabs lower">text</label>
<style>.taxtabs.lower{text-transform: lowercase;}</style>
1
user192344