html - 手动插入网站标语

Question

我正在尝试将网站标语手动添加到我网站的标题图像中。下面是我正在使用的 Jquery 和 CSS。无法显示任何文本。

www.jobspark.ca

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">  </script>

<script type="text/javascript">
$(document).ready(function(){
$("#banner-area").prepend("<div id='banner-tagline'>Tagline</div>");
});
</script>


#banner-tagline { color: #fff; font-size: 40px; text-align:center;  z-index: 99999; }

更新太棒了，谢谢你成功了。唯一剩下的问题是向下滚动时显示在我的固定导航前面，我希望它在页面上更垂直居中

Answer 1

将一个添加position: absolute到您的#banner-tagline 元素 CSS。已编辑：此外，仅在使用or位置z-index时才生效。absolutefixed

Answer 2

z-index 仅适用于定位元素，因此将 position:relative （或 position:absolute 取决于你将如何定位你的标语）添加到#banner-tagline 的样式中。

Answer 3

您只需按如下方式更新“横幅标语”css。我刚刚添加了最高位置。希望它对你有用。

#banner-tagline {
    color: #FFFFFF;
    font-size: 40px;
    position: relative;
    text-align: center;
    z-index: 99999;
    top: 50%;
}