文字修饰：没有工作 [英] Text-decoration: none not working

问题描述

完全困惑！我试着用几种不同的方式重写 text-decoration：none 。我还设法通过锁定文本来重新定义文本的大小，但 text-decoration：none 代码不会采用。

非常感谢。

代码

.widget {height：320px; width：220px; background-color：＃e6e6e6;位置：相对;溢出：隐藏; } .title {font-family：Georgia，Times New Roman，serif; font-size：12px;颜色：＃E6E6E6; text-align：center; letter-spacing：1px;文字转换：大写;背景颜色：＃4D4D4D;位置：绝对; top：0;填充：5px;宽度：100％; margin-bottom：1px;身高：28px; text-decoration：none;} a .title {text-decoration：none;}

 < a href =＃> < div class =widget> < div class =title>加下划线。为什么< / DIV> < / div>< / a>  

解决方案

在内联元素（a）中有一个块元素（div）。这适用于HTML 5，但不适用于HTML 4.因此，也只有实际支持HTML 5的浏览器。

当浏览器遇到无效标记时，他们会尝试修复它，但不同的浏览器会以不同的方式做到这一点，所以结果会有所不同。有些浏览器会将块元素移动到内联元素之外，有些浏览器会忽略它。

Totally baffled! I've tried rewriting the text-decoration: none line several different ways. I also managed to re-size the text by targeting it but the text-decoration: none code will not take.

Help much appreciated.

Code

.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>

解决方案

You have a block element (div) inside an inline element (a). This works in HTML 5, but not HTML 4. Thus also only browsers that actually support HTML 5.

When browsers encounter invalid markup, they will try to fix it, but different browsers will do that in different ways, so the result varies. Some browsers will move the block element outside the inline element, some will ignore it.

这篇关于文字修饰：没有工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！