web-dev-qa-db-ja.com

テキスト装飾：動作していません

完全に困惑しました！ text-decoration: none行をいくつかの異なる方法で書き直してみました。ターゲットを絞ってテキストのサイズを変更することもできましたが、text-decoration: noneコードは使用できません。

感謝します。

コード

.widget    
{
     height: 320px;
     width: 220px;
     background-color: #e6e6e6;
     position: relative;                              
     overflow: hidden;                          
}


.title    
{
     font-family: Georgia, Times New Roman, serif;
     font-size: 12px;
     color: #E6E6E6;
     text-align: center;
     letter-spacing: 1px;
     text-transform: uppercase;
     background-color: #4D4D4D;    
     position: absolute;
     top: 0;
     padding: 5px;
     width: 100%;
     margin-bottom: 1px;
     height: 28px;
     text-decoration: none;
}

a .title    
{
     text-decoration: none;
}
<a href="#">
    <div class="widget">  
        <div class="title">Underlined. Why?</div>  
    </div>
</a>
csshtmltext-decorations
27
Olly F

インライン要素（a）内にブロック要素（div）があります。これはHTML 5で機能しますが、HTML 4では機能しません。したがって、実際にHTML 5をサポートしているブラウザのみです。

ブラウザーが無効なマークアップに遭遇すると、それを修正しようとしますが、ブラウザーが異なればその方法も異なるため、結果は異なります。一部のブラウザはインライン要素の外側にブロック要素を移動しますが、無視するブラウザもあります。

30
Guffa
a:link{
  text-decoration: none!important;
}

=>私と一緒に働く:)、幸運を

27
DongNguyen

CSS Pseudo-classes を使用して、タグにクラスを指定します。次に例を示します。

<a class="noDecoration" href="#">

これをスタイルシートに追加します。

.noDecoration, a:link, a:visited {
    text-decoration: none;
}
6
Mimeshead

ヘッダータグに次のステートメントを追加します。

<style>
a:link{
  text-decoration: none!important;
  cursor: pointer;
}
</style>
5
Ram Madhavan

text-decoration: none;あなたのa：hover css。

3
Esci Villagonzalo Morales

答えがあります：

<a href="#">
    <div class="widget">  
        <div class="title" style="text-decoration: none;">Underlined. Why?</div>  
    </div>
</a>​

できます。

1
jnhy

「text-decoration：none;」を削除しても、下線はありません。あなたのコードから。しかし、私は同じような経験をしました。

次に、コードを追加しました

a{
 text-decoration: none;
}

そして

a:hover{
 text-decoration: none;
}

したがって、：hoverを使用してコードを試してください。

1
SungWoo_Park

WordPressテーマをカスタマイズしようとしたときに多くの頭痛がしましたが、テキストの装飾は役に立たなかった。私の場合は、ボックスの影も削除しなければならなかった。

a:hover {
    text-decoration: none;
    box-shadow: none;
}
1
Zoltan Febert

ナビゲーションバーが欲しいなら

ul{ list-style-type: none; } li{text-decoration: none;
  • これにより、リストタイプのスタイルを[なし]または[なし]にすることができます。

<a>タグ付き：

a:link {text-decoration: none}
1
PIZZZZZZZZZZZA is here

以下のコードを使用して、私のものをChromeで動作させました。ネストを調整できます。

a:-webkit-any-link { color: black; }
0
Eben Hafkamp

これをスタイルシートに追加してみてください：

a {text-decoration:none;}
0
Losbear

すべてのリンクに特定のクラスを追加します。

html：

<a class="class1 class2 noDecoration"> text </a>

cssで：

.noDecoration {
  text-decoration: none;
}
0
Alouani Younes