我希望在<h1>
标记中的某些文字后面显示 。但是当我添加图像时,它会替换文本并将文本推到下面。
CSS
body {
background-color: #1a1a1a;
}
header,
h1 {
text-align: center;
font-family: CGF Locust Resistance;
font-size: 50px;
color: lightgray;
-webkit-text-stroke: 1.5px #000;
}
header {
margin: 0;
padding: 0;
height: 100px;
border-bottom: .5px solid #b3b3b3;
}
nav {
position: relative;
top: -5px;
margin: auto;
padding: 0;
list-style: none;
width: 100%;
text-align: center;
border-bottom: .5px solid #b3b3b3;
}
nav ul li {
display: inline;
color: #fff;
font-family: CGF Locust Resistance;
font-size: 12.5px;
padding: 20px;
}
.red {
color: red;
}
#omen {
z-index: -1;
}
答案 0 :(得分:1)
将图像设置为标题的背景图像。这就是你追求的目标吗?
答案 1 :(得分:0)
h1 {
position : abosolute;
}
这应该可以解决问题,但最好使用ID而不是改变你身边的h标签
答案 2 :(得分:0)
将此参数放入css中的图像对象(创建自定义类的示例):
.image{
position: relative;
}
这一篇文章:
.text{
position: absolute;
}
当然,您必须将此类设置为它的各个对象。希望它有所帮助!
答案 3 :(得分:0)
h1 {
background: url(the/filepath/to/your/image.jpg) no-repeat center 100px;
background-size: 400px auto;
}
这就是在这种情况下如何使用背景图像。 center 100px
表示水平居中,距离顶部100px(与h1
元素相关)。