Html 与ID Div一起使用时,链接带有下划线(尝试删除下划线)
您好在这里,我正在尝试编辑#navbar2的链接样式以删除下划线。该id名为Navbar2,我甚至还包括了一个文本装饰:无;样式设置到它,但链接仍然保持下划线 这是我的网站: 这是我的HTML:Html 与ID Div一起使用时,链接带有下划线(尝试删除下划线),html,css,Html,Css,您好在这里,我正在尝试编辑#navbar2的链接样式以删除下划线。该id名为Navbar2,我甚至还包括了一个文本装饰:无;样式设置到它,但链接仍然保持下划线 这是我的网站: 这是我的HTML: <!doctype html> <head> <title>The Totem Pole News</title> <script type="text/javascript"> var _gaq = _gaq || []; _gaq
<!doctype html>
<head>
<title>The Totem Pole News</title>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-45342007-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<meta name="description" content=" A totem pole themed news website posting articles on music, movies, video games, mobile applications, and news.">
<link href="thecss.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
<link rel="icon" type="image/ico" href="images/favicon.ico">
<meta http-equiv="X-UA-Compatible" content="IE=8" />
</head>
<body>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div id="socialmediaplugins">
<div id="facebook"><div class="fb-like" data-href="http://www.thetotempole.ca" data-width="The pixel width of the plugin" data-height="The pixel height of the plugin" data-colorscheme="light" data-layout="standard" data-action="like" data-show-faces="true" data-send="false"></div></div>
<div id="twitter"><a href="https://twitter.com/share" class="twitter-share-button">Tweet</a></div>
<g:plusone></g:plusone>
</div>
<div id="container">
<div id="contentbox" align="Center">
<a href="#"><div id="banner" align="Center">
</div></a>
<div id="navbar">
<p><a href="#"><img src="images/home.png" width="65" height="54" alt="picture of a house to relate to the home page (content)" style="position: absolute; left: 19px; top: 8px;"><span style="position: absolute; left: 19px; top: 70px;">Content</span></a>
<a href="#"><img src="images/eagleicon.gif" width="73" height="39" alt="An Eagle icon for the News section of the Totem Pole" style="position: absolute; left: 111px; top: 21px;"><span style="position: absolute; left: 121px; top: 71px;">News</span></a>
<a href="#"><img src="images/owlicon.gif" width="81" height="61" alt="An Owl icon for the Music section of the totem pole" style="position: absolute; left: 210px; top: 11px;"><span style="position: absolute; left: 226px; top: 73px;">Music</span></a><a href="#"><img src="images/wolficon.gif" width="88" height="54" alt="A Wolf icon for the Movies section of the totem pole" style="position: absolute; left: 320px; top: 15px;"><span style="position: absolute; left: 332px; top: 72px;">Movies</span></a>
<a href="#"><img src="images/hareimage.gif" width="60" height="56" alt="A Hare icon for Video Game section of the Totem Pole" style="position: absolute; left: 441px; top: 13px;"><span style="position: absolute; left: 428px; top: 73px;">Video Games</span></a>
<a href="#"><img src="images/bearicon.gif" width="91" height="57" alt="A bear icon for the Health section of The Totem Pole" style="position: absolute; left: 551px; top: 13px;"><span style="position: absolute; left: 580px; top: 72px;">Health</span></a></p>
</div>
<!--Nav Bar 2-->
<div id="navbar2">
<a href="#">About Us</a> <a href="#">Feedback</a> <a href="#">Subscribe</a>
</div>
<!-- Atomz HTML for Search -->
<div id="searchbar">
<form method="get" action="http://search.atomz.com/search/">
<input id="searchbox" size="13" name="sp_q" value="Search..." onFocus="if (this.value == 'Search...') {this.value=''}">
<input class="css_btn_class" type="submit" value="Search">
<input type="hidden" name="sp_a" value="sp1005092e">
<input type="hidden" name="sp_p" value="all">
<input type="hidden" name="sp_f" value="UTF-8">
</form>
</div>
<img src="images/eagle.png" id="eagle" width="1144" height="325" alt="News content box">
<img src="images/musicbox.png" id="owl" width="1134" height="325" alt="Music content box">
<img src="images/wolf.png" id="wolf" width="1184" height="325" alt="Movies content box">
<img src="images/hare.png" id="hare" width="1115" height="325" alt="Video game content box">
<img src="images/bear.png" id="bear" width="1172" height="325" alt="Health content box">
<div id="footer"><a href="#">Sitemap</a> <a href="#">About Us</a> <a href="#">Feedback</a></div>
<!-- This is the end of the contentbox --></div>
<!-- This is the end of the container div -->
</div>
</body>
</html>
图腾柱新闻
var _gaq=_gaq | |[];
_gaq.push(['''u setAccount','UA-45342007-1']);
_gaq.push([''u trackPageview']);
(功能(){
var ga=document.createElement('script');ga.type='text/javascript';ga.async=true;
ga.src=('https:'==document.location.protocol?'https://ssl' : 'http://www“)+”.google analytics.com/ga.js';
var s=document.getElementsByTagName('script')[0];s.parentNode.insertBefore(ga,s);
})();
!函数(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http://.test(d.location)'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}(document,'script,'twitter wjs');
(功能(d、s、id){
var js,fjs=d.getElementsByTagName[0];
if(d.getElementById(id))返回;
js=d.createElement;js.id=id;
js.src=“//connect.facebook.net/en_GB/all.js#xfbml=1”;
fjs.parentNode.insertBefore(js,fjs);
}(文档“脚本”、“facebook jssdk”);
这是我的CSS:
html {
background: url(images/pine.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/pine.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/pine.jpg', sizingMethod='scale')";
}
body {
margin-bottom:0px;
font-family: Verdana, Geneva, sans-serif;
}
a {
outline : none;
border: none;
}
a:hover {
color: #0FC;
}
#container {
width: 1000px;
height:1875px;
position:relative;
margin-right: auto;
margin-left: auto;
z-index:1;
margin-bottom: 50px;
}
#facebook {
position:fixed;
right:100px;
z-index:15;
}
#twitter {
position:fixed;
z-index:16;
right:120px;
}
#google {
position:fixed;
top:7px;
right: 135px;
}
#socialmediaplugins {
text-align: right;
position: fixed;
background: rgb(125,126,125); /* Old browsers */
background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(247,247,247,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(247,247,247,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(125,126,125,1) 0%,rgba(247,247,247,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#f7f7f7',GradientType=0 ); /* IE6-9 */
margin: 0px;
top: 0px;
left: 0px;
right: 0px;
z-index:14;
}
#searchbox {
background-color:#01bff6;
border-radius:4px;
}
#searchbox:hover {
background-color:#76b618;
border-radius:4px;
}
#searchbox:active {
background-color:#01bff6;
border-radius:4px;
}
#contentbox {
background-color:black;
background-image:url(images/wooden.jpg);
width: 1000px;
margin-bottom:50px;
height: 1875px;
box-shadow:2px 2px 10px 10px #060606;
-webkit-box-shadow:2px 2px 10px 10px #060606;
-moz-box-shadow:2px 2px 10px 10px #060606;
/* For IE<9 */
filter:
progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=0,strength=5),
progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=45,strength=2),
progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=90,strength=5),
progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=135,strength=5),
progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=180,strength=10),
progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=225,strength=5),
progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=270,strength=5),
progid:DXImageTransform.Microsoft.Shadow(color=#060606,direction=315,strength=2);
}
#banner {
background-image:url(images/totempolebanner.gif);
position:absolute;
top:25px;
width:768px;
height:120px;
left:116px;
}
#navbar {
float: left;
position: absolute;
top: 146px;
left: 76px;
width: 844px;
height: 158px;
}
a#navbar2 {
text-decoration:none;
}
#navbar2 {
position: absolute;
top: 148px;
left: 664px;
width: 273px;
height: 24px;
font-size: 11px;
}
#searchbar {
position: absolute;
top: 23px;
left: 885px;
width: 118px;
height: 69px;
}
.css_btn_class {
font-size:9px;
position: relative;
top:0px;
right:4px;
width:90px;
height:25px;
font-family:Verdana;
font-weight:normal;
-moz-border-radius:7px;
-webkit-border-radius:7px;
border-radius:7px;
border:1px solid #35d914;
padding:7px 24px;
text-decoration:none;
background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ff9d00), color-stop(100%, #ffe711) );
background:-moz-linear-gradient( center top, #ff9d00 5%, #ffe711 100% );
background:-ms-linear-gradient( top, #ff9d00 5%, #ffe711 100% );
background-color:#ff9d00;
color:#ff0000;
display:inline-block;
text-shadow:0px 0px 1px #117cff;
-webkit-box-shadow: 0px 0px 0px 0px #117cff;
-moz-box-shadow: 0px 0px 0px 0px #117cff;
box-shadow: 0px 0px 0px 0px #117cff;
background-image: url(images/unnamed.gif);
background-repeat:no-repeat;
background-position:right;
}.css_btn_class:hover {
width:90px;
background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffe711), color-stop(100%, #ff9d00) );
background:-moz-linear-gradient( center top, #ffe711 5%, #ff9d00 100% );
background:-ms-linear-gradient( top, #ffe711 5%, #ff9d00 100% );
background-color:#ffe711;
background-image: url(images/unnamed.gif);
background-repeat:no-repeat;
background-position:right;
}.css_btn_class:active {
position:relative;
width:90px;
top:1px;
background-image: url(images/unnamed.gif);
background-repeat:no-repeat;
background-position:right;
}
/* This css button was generated by css-button-generator.com */
img {border:none;}
#eagle {
position:relative;
right: 144px;
top:250px;
}
#owl {
top:575px;
position:absolute;
left:0px;
}
#wolf {
top:900px;
position:absolute;
right:0px;
}
#hare {
top:1225px;
position:absolute;
left:0px;
}
#bear {
top:1550px;
position:absolute;
right:0px;
}
#footer {
position: absolute;
left: -12px;
top: 1882px;
width: 251px;
}
html{
背景:url(images/pine.jpg)没有固定的重复中心;
-webkit背景尺寸:封面;
-moz背景尺寸:封面;
-o-背景尺寸:封面;
背景尺寸:封面;
过滤器:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/pine.jpg',sizingMethod='scale');
-ms过滤器:“progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/pine.jpg',sizingMethod='scale')”;
}
正文{
边缘底部:0px;
字体系列:Verdana,日内瓦,无衬线;
}
a{
大纲:无;
边界:无;
}
a:悬停{
颜色:#0FC;
}
#容器{
宽度:1000px;
身高:1875px;
位置:相对位置;
右边距:自动;
左边距:自动;
z指数:1;
边缘底部:50px;
}
#脸谱网{
位置:固定;
右:100px;
z指数:15;
}
#推特{
位置:固定;
z指数:16;
右:120px;
}
#谷歌{
位置:固定;
顶部:7px;
右:135px;
}
#社会医学{
文本对齐:右对齐;
位置:固定;
背景:rgb(125126125);/*旧浏览器*/
背景:-moz线性梯度(顶部,rgba(125126125,1)0%,rgba(247,1)100%);/*FF3.6+*/
背景:-webkit渐变(线性、左上、左下、色挡(0%,rgba(125126125,1))、色挡(100%,rgba(247,1));/*铬、Safari4+*/
背景:-webkit线性梯度(顶部,rgba(125126125,1)0%,rgba(247,1)100%);/*Chrome10+,Safari5.1+*/
背景:-o-线性梯度(顶部,rgba(125126125,1)0%,rgba(247,1)100%);/*Opera 11.10+*/
背景:-ms线性梯度(顶部,rgba(125126125,1)0%,rgba(247,1)100%);/*IE10+*/
背景:线性梯度(到底部,rgba(125126125,1)0%,rgba(247,1)100%);/*W3C*/
过滤器:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d7e7d',endColorstr='#f7f7f7',GradientType=0);/*IE6-9*/
边际:0px;
顶部:0px;
左:0px;
右:0px;
z指数:14;
}
#搜索框{
背景色:#01bff6;
边界半径:4px;
}
#搜索框:悬停{
背景色:#76b618;
边界半径:4px;
}
#搜索框:活动{
背景色:#01bff6;
边界半径:4px;
}
#内容盒{
背景色:黑色;
背景图片:url(images/woody.jpg);
宽度:1000px;
边缘底部:50px;
身高:1875px;
盒影:2PX2PX10PX10PX#060606;
-网络工具包盒阴影:2px 2px 10px 10px#060606;
-莫兹盒阴影:2PX2PX10PX10PX#060606;
/*对于IE请将其放入您的样式中:
#navbar2 a { text-decoration: none; }
样式需要应用于a
元素本身,而不是navbar/container元素。Blake Manns解决方案将删除所有超链接的下划线。您可以向navbar2中的链接添加一个类标记,并使用css删除它们的下划线。这应该是可行的
将此添加到css中
.navbar2link
{
text-decoration:none;
}
像这样更改链接的标记
<a href="#" class="navbar2link">About Us</a>
在css中,编辑以下内容:
a#navbar2 {
text-decoration:none;
}
到
但是我只希望#navbar2 div的链接不带下划线…只需要那些链接,谢谢#navbar2 a{text decoration:none;}
。基本上你只需要在a
上显式指定它,否则你的样式会被默认值覆盖。
a#navbar2 {
text-decoration:none;
}
#navbar2 a {
text-decoration:none;
}