2017-02-20 97 views
-1

所以我一直试图摆脱这个链接下划线,我似乎无法弄清楚。我已经把文字装饰:没有;在一切和任何我能想到的,试图解决这个问题,因此,如果任何人有任何想法,如何摆脱这个倔强的下划线,将真正帮助的!谢谢!无法摆脱链接下划线

#recentwork { 
 
    background-color: #1DA0A3; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    text-align: center; 
 
\t text-decoration: none; 
 

 
} 
 

 
#recent{ 
 
\t padding:20px; 
 
\t text-decoration: none; 
 
\t 
 
} 
 
#recentwork img { 
 
    padding: 20px; 
 
    width: 200px; 
 
    height: 200px; 
 
\t text-decoration: none; 
 
} 
 

 
.more{ 
 
\t text-decoration: none; 
 
\t color:black; 
 
} 
 

 
.more:hover{ 
 
\t color:white; 
 
} 
 

 
.titles{ 
 
\t text-decoration:none; 
 
\t 
 
} 
 

 
.parentdiv{ 
 
    display:inline-block; 
 
\t text-decoration: none; 
 
\t 
 
} 
 

 
@media only screen and (min-width: 760px) { 
 
    #recentwork img { 
 
    width: 300px; 
 
    height: 300px; 
 
\t text-decoration:none; 
 
    } 
 
} 
 

 
.underline{ 
 
\t text-decoration: none; 
 
}
<section id="skills"> 
 
<div id="recentwork"> 
 
    <h2 id="recent"> Most Recent Work</h2> 
 

 

 
<div class="parentdiv"> 
 
<a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
<img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
<div class="underline"> 
 
<h3 class="titles"> Web Design</h3></div> 
 
</a> 
 
<a href="" class="more"><h3 > See More</h3></a> 
 
</div> 
 
    
 
    <div class="parentdiv"> 
 
<a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
<img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
<h3 class="titles"> Photography</h3> 
 
</a> 
 
<a href="" class="more"><h3 > See More</h3></a> 
 
</div> 
 

 
    
 
    <div class="parentdiv"> 
 
<a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
<img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
<h3 class="titles"> Print</h3> 
 
</a> 
 
<a href="" class="more"><h3 > See More</h3></a> 
 
</div> 
 

 
    <div class="parentdiv"> 
 
<a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
<img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
<h3 class="titles"> Logos</h3> 
 
</a> 
 
<a href="" class="more"><h3 > See More</h3></a> 
 
</div> 
 
    
 

 
</div> 
 
</section>

+1

下划线引起b:如下所示y中的'了''加文字装饰:none'它 – Akshay

+0

要添加的文字修饰到错误的区域。 –

+1

哇我觉得真的很愚蠢..我想这只是其中的一个日子..谢谢@Akshay – Cakers

回答

2

添加文字装饰无人a标签

#recentwork { 
 
    background-color: #1DA0A3; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    text-align: center; 
 
\t text-decoration: none; 
 

 
} 
 

 
#recent{ 
 
\t padding:20px; 
 
\t text-decoration: none; 
 
\t 
 
} 
 
#recentwork img { 
 
    padding: 20px; 
 
    width: 200px; 
 
    height: 200px; 
 
\t text-decoration: none; 
 
} 
 

 
.more{ 
 
\t text-decoration: none; 
 
\t color:black; 
 
} 
 

 
.more:hover{ 
 
\t color:white; 
 
} 
 

 
/* here is the change */ 
 
/* apply text decoration none to anchor tag */ 
 
a{ 
 
\t text-decoration:none; 
 
\t 
 
} 
 

 
.parentdiv{ 
 
    display:inline-block; 
 
\t text-decoration: none; 
 
\t 
 
} 
 

 
@media only screen and (min-width: 760px) { 
 
    #recentwork img { 
 
    width: 300px; 
 
    height: 300px; 
 
\t text-decoration:none; 
 
    } 
 
} 
 

 
.underline{ 
 
\t text-decoration: none; 
 
}
<section id="skills"> 
 
<div id="recentwork"> 
 
    <h2 id="recent"> Most Recent Work</h2> 
 

 

 
<div class="parentdiv"> 
 
<a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
<img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
<div class="underline"> 
 
<h3 class="titles"> Web Design</h3></div> 
 
</a> 
 
<a href="" class="more"><h3 > See More</h3></a> 
 
</div> 
 
    
 
    <div class="parentdiv"> 
 
<a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
<img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
<h3 class="titles"> Photography</h3> 
 
</a> 
 
<a href="" class="more"><h3 > See More</h3></a> 
 
</div> 
 

 
    
 
    <div class="parentdiv"> 
 
<a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
<img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
<h3 class="titles"> Print</h3> 
 
</a> 
 
<a href="" class="more"><h3 > See More</h3></a> 
 
</div> 
 

 
    <div class="parentdiv"> 
 
<a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
<img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
<h3 class="titles"> Logos</h3> 
 
</a> 
 
<a href="" class="more"><h3 > See More</h3></a> 
 
</div> 
 
    
 

 
</div> 
 
</section>

0

使用此

.parentDiv a { text-decoration: none; }

应该解决的问题。

1

只是a{text-decoration:none}就足够了。

#recentwork { 
 
    background-color: #1DA0A3; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    text-align: center; 
 
} 
 

 
a { 
 
    text-decoration: none; 
 
} 
 

 
#recent { 
 
    padding: 20px; 
 
} 
 

 
#recentwork img { 
 
    padding: 20px; 
 
    width: 200px; 
 
    height: 200px; 
 
} 
 

 
.more { 
 
    color: black; 
 
} 
 

 
.more:hover { 
 
    color: white; 
 
} 
 

 
.parentdiv { 
 
    display: inline-block; 
 
} 
 

 
@media only screen and (min-width: 760px) { 
 
    #recentwork img { 
 
    width: 300px; 
 
    height: 300px; 
 
    } 
 
} 
 

 
.underline {}
<section id="skills"> 
 
    <div id="recentwork"> 
 
    <h2 id="recent"> Most Recent Work</h2> 
 

 

 
    <div class="parentdiv"> 
 
     <a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
     <img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
     <div class="underline"> 
 
      <h3 class="titles"> Web Design</h3> 
 
     </div> 
 
     </a> 
 
     <a href="" class="more"> 
 
     <h3> See More</h3> 
 
     </a> 
 
    </div> 
 

 
    <div class="parentdiv"> 
 
     <a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
     <img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
     <h3 class="titles"> Photography</h3> 
 
     </a> 
 
     <a href="" class="more"> 
 
     <h3> See More</h3> 
 
     </a> 
 
    </div> 
 

 

 
    <div class="parentdiv"> 
 
     <a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
     <img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
     <h3 class="titles"> Print</h3> 
 
     </a> 
 
     <a href="" class="more"> 
 
     <h3> See More</h3> 
 
     </a> 
 
    </div> 
 

 
    <div class="parentdiv"> 
 
     <a href="http://4vector.com/thumb_data/v4l-132979.jpg" data-lightbox="website" data-title=""> 
 
     <img src="http://4vector.com/thumb_data/v4l-132979.jpg" width="200px" height="200px"> 
 
     <h3 class="titles"> Logos</h3> 
 
     </a> 
 
     <a href="" class="more"> 
 
     <h3> See More</h3> 
 
     </a> 
 
    </div> 
 

 

 
    </div> 
 
</section>

1

你必须直接添加text-decorationa标签 - 而不是一个diva位于

您可以定位自己的整段内的所有a标签的方式。

#skills a { 
    text-decoration: none; 
}