Question

我做了一个导航栏。这是代码：

<style type="text/css">
.topbackground {
        background-repeat:no-repeat;
    background-position: top;
    height: 150px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:20px;
    color:#FFFFFF;

}


.realnewsbg {
        background-image: url(http://tinkatips.hol.es/nav.png);
width: 1000px;
height: 122px;
    float:left;
        margin-top:-130px;
    margin-left:120px;
    text-align:center;
}


.realnews {
background-image: url(http://deltaflow.com/themes/deltaflow/images/pixel_transparent.gif);
width: 1000px;
height: 122px;
    float:left;
        margin-top:-40px;
    margin-left:220px;
    text-align:left;
}

.tttime {

width: 156px;
height: 122px;
    padding-top:-0px;
        margin-top:-40px;
    margin-left:850px;
    text-align:center;
}


body {background-color:#b0c4de;}
</style>

<style type="text/css">

#ajaxticker1{
width: 1000px;
height: 100px;
}

#ajaxticker1 div{ /*IE6 bug fix when text is bold and fade effect (alpha filter) is enabled. Style inner DIV with same color as outer DIV*/
}

.someclass{ //class to apply to your scroller(s) if desired
}

</style>

<script src="ajaxticker.js" type="text/javascript">

/***********************************************
* Ajax Ticker script (txt file source)- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

</script>

<body>
<center><div class="topbackground">
<img id="Image-Maps_3201307070909053" src="http://deltaflow.com/themes/deltaflow/images/pixel_transparent.gif" usemap="#Image-Maps_3201307070909053" border="0" width="1000" height="122" alt="" />
<map id="_Image-Maps_3201307070909053" name="Image-Maps_3201307070909053">
<area shape="rect" coords="19,6,196,66" href="http://www.google.com" alt="" title=""    />
<area shape="rect" coords="232,7,409,67" href="http://www.google.com" alt="" title=""    />
<area shape="rect" coords="438,5,615,65" href="http://www.twitter.com/" alt="" title=""    />
<area shape="rect" coords="651,7,828,67" href="http://www.google.com" alt="Coming Soon !" title="Coming Soon !"    />
<area shape="rect" coords="998,120,1000,122" href="http://www.image-maps.com/index.php?aff=mapped_users_3201307070909053" alt="Image Map" title="Image Map" />
</map><div class="realnewsbg"></div>

<div class="realnews"><script type="text/javascript">
var xmlfile="tickercontent.txt" //path to ticker txt file on your server.
//ajax_ticker(xmlfile, divId, divClass, delay, optionalfadeornot)
new ajax_ticker(xmlfile, "ajaxticker1", "someclass", [3500], "fade")
</script></div>

<div class="tttime">
<script type="text/javascript" src="http://www.24webclock.com/clock24.js"></script>
<table border="0" bgcolor="#a0a0a0" cellspacing=1 cellpadding=3 class="clock24st" style="line-height:14px; padding:0;">
<tr><td bgcolor="#FFFFFF" class="clock24std" style="font-family:arial; font-size:12px;"><a href="http://www.24webclock.com/de/"><img src="http://www.24webclock.com/ico.gif" width="14" height="14" border="0" alt="Kostenlose Uhr fur die Homepage" align="left" hspace="2"></a> <a href="http://www.24webclock.com/" style="text-decoration:none;"><span class="clock24s" id="clock24_77176" style="color:#6393C3;">free clock for website</span></a></td></tr>
</table>
<script type="text/javascript">
var clock24_77176 = new clock24('77176',0,'%HH:%nn:%ss %P','en');
clock24_77176.daylight('GB'); clock24_77176.refresh();
</script></div>
</div>
</div>
<div class="header"></div></div></body>

您可以在此处找到其他文件：http://www.dynamicdrive.com/dynamicindex2/ajaxticker.htm。问题在于，由于时间的推移，自动收录器位于导航栏（nav.png）后面。我怎么能阻止这个？

Answer 1

使用z-index将时钟放在前面，你可以通过将导航栏的z-index设置为-1来实现：

z-index: -1;

Answer 2

修正了它！

刚刚将标题移动到标题之下！

图像背后的文字

2 个答案: