Heim  >  Artikel  >  Web-Frontend  >  急~急~急跪求大神,链接被遮挡,无法点击_html/css_WEB-ITnose

急~急~急跪求大神,链接被遮挡,无法点击_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:48:551196Durchsuche

跪求大神,链接被遮挡,无法点击,现在提供css样式和网页代码,万分感谢!
CSS:

@charset "utf-8";*{margin:0;padding:0;}body, html{width:100%;height:100%;}body{background:url("../images/body_bg.jpg") repeat-x;} #mainBody{position:relative;width:100%;height:100%;}.cloud{position:absolute;top:-110px;left:0px;width:100%;height:100%;background:url("../images/cloud.png") no-repeat;opacity:0.8;}     #cloud2{}#weather{background:url(../images/sun.png) no-repeat;border-radius:90px;width:150px;height:150px;position:absolute;left:1130px;top:0px;}#logo{position:absolute;top:0px;left:0px;background:url("../images/logo.png") no-repeat;opacity:0.8;}     #weather img{margin:30px -90px;}#content { }#content p { margin:20px; }#menu { margin:40px 0 0 150px; }#menu ul { list-style:none; }#menu ul li { display:inline; float:left; margin-bottom:20px; }#menu ul li:first-child a { -moz-border-radius-topleft: 12px; -webkit-border-top-left-radius:12px; }#menu ul li:last-child a { -moz-border-radius-topright: 12px; -webkit-border-top-right-radius:12px; }#menu ul li a { padding:20px; background: rgba(255,138,30,0.3); text-decoration: none; font: bold 14px Helvetica, Sans-Serif; letter-spacing: -1px; color: #402e16;	text-shadow: #eee 0px 0px 2px; }	#menu ul li a:hover { -moz-box-shadow: 0 -5px 10px #777; -webkit-box-shadow: 0 -5px 10px #777;	background: -webkit-gradient(		linear, right bottom, left top, color-stop(0, rgb(237,227,112)), color-stop(0.72, rgb(255,173,10))) !important;	background: -moz-linear-gradient(		right bottom, rgb(237,227,112) 0%, rgb(255,173,10) 72%) !important;	background-color:rgb(255,173,10) !important;	-moz-opacity:.90; filter:alpha(opacity=90); opacity:.90; }#menu ul li a.active { background: rgba(255,138,30,0.8) !important; }



网页代码:
<div id="wrapper">	<div id="content">			<div id="menu">				<ul>					<li><a href="#" title="首页">首页</a></li>					<li><a href="http://www.baidu.com" target="_blank" title="个人主页" class="active">个人主页</a></li>					<li><a href="http://www.baidu.com" target="_blank" title="个人主页">个人主页</a></li>					<li><a href="http://www.baidu.com" target="_blank" title="个人主页">个人主页</a></li>					<li><a href="http://www.baidu.com" target="_blank" title="个人主页">个人主页</a></li>					<li><a href="http://www.baidu.com" target="_blank" title="个人主页">个人主页</a></li>					<li><a href="http://www.baidu.com" target="_blank" title="个人主页">个人主页</a></li>					<li><a href="http://www.baidu.com" target="_blank" title="个人主页">个人主页</a></li>				</ul>			</div>	</div></div><div id="mainBody">    <div id="cloud1" class="cloud"></div>    <div id="cloud2" class="cloud"></div></div><div id="weather"><img  src="images/cloud.png"    style="max-width:90%" alt="急~急~急跪求大神,链接被遮挡,无法点击_html/css_WEB-ITnose" ></div><div id="logo" style="text-align:center; top:180px; left:550px;"><img  src="images/cloud.png"    style="max-width:90%" alt="急~急~急跪求大神,链接被遮挡,无法点击_html/css_WEB-ITnose" ></div>


回复讨论(解决方案)

#wrapper{position: absolute;z-index: 222222;}

#weather{background:url(../images/sun.png) no-repeat;border-radius:90px;width:150px;height:150px;position:absolute;left:1130px;top:0px;position: absolute;z-index:222222;}

楼上大神,我把#weather改成什么这样,链接还是点击不了啊

# wrapper{position: absolute;z-index: 222222;}

楼上的大神是什么意思啊?????
#weather{background:url(../images/sun.png) no-repeat;border-radius:90px;width:150px;height:150px;left:1130px;top:0px;position: absolute;z-index:222222;}

如果在上面的#weather里面去掉background:url(../images/sun.png) no-repeat;border-radius:90px;width:150px;height:150px;left:1130px;top:0px;,我其他又不正常了呀,跪求正确的解决方法。万分的感激!

@charset "utf-8";*{margin:0;padding:0;}body, html{width:100%;height:100%;}body{background:url("../images/body_bg.jpg") repeat-x;} #mainBody{position:relative;width:100%;height:100%;}.cloud{position:absolute;top:-110px;left:0px;width:100%;height:100%;background:url("../images/cloud.png") no-repeat;opacity:0.8;}     #cloud2{}#weather{background:url(../images/sun.png) no-repeat;border-radius:90px;width:150px;height:150px;position:absolute;left:1130px;top:0px;}#logo{position:absolute;top:0px;left:0px;background:url("../images/logo.png") no-repeat;opacity:0.8;}     #weather img{margin:30px -90px;} #content { }#content p { margin:20px; }#menu { margin:40px 0 0 150px; }#menu ul { list-style:none; }#menu ul li { display:inline; float:left; margin-bottom:20px; }#menu ul li:first-child a { -moz-border-radius-topleft: 12px; -webkit-border-top-left-radius:12px; }#menu ul li:last-child a { -moz-border-radius-topright: 12px; -webkit-border-top-right-radius:12px; }#menu ul li a { padding:20px; background: rgba(255,138,30,0.3); text-decoration: none; font: bold 14px Helvetica, Sans-Serif; letter-spacing: -1px; color: #402e16;    text-shadow: #eee 0px 0px 2px; }   #menu ul li a:hover { -moz-box-shadow: 0 -5px 10px #777; -webkit-box-shadow: 0 -5px 10px #777;    background: -webkit-gradient(        linear, right bottom, left top, color-stop(0, rgb(237,227,112)), color-stop(0.72, rgb(255,173,10))) !important;    background: -moz-linear-gradient(        right bottom, rgb(237,227,112) 0%, rgb(255,173,10) 72%) !important;    background-color:rgb(255,173,10) !important;    -moz-opacity:.90; filter:alpha(opacity=90); opacity:.90; }#menu ul li a.active { background: rgba(255,138,30,0.8) !important; }#wrapper{position: absolute;z-index: 222222;}

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn