Css 将标题图像中的文本和fa V形与引导对齐

我对Bootstrap是个新手，我建立了一个在线课程网站！我现在正试图根据自己的需要进行定制。我想知道如何对齐我的文字和fa V形。我想把我的文字放在女孩的头顶上，还有我现在看到的V形文字。但问题是，当我将图像缩小到<370时，文本被我的菜单掩盖，在横向模式下，我失去了所有内容。我尝试了很多组合！！！谢谢

我的css是

#home-heading h3 {
    color: #fff;
    font-size: 40px;
    font-weight: 700;
    margin: -75px 0 300px 0;
}

---

您可以在

尝试相对和绝对位置查看站点

#home-content-box-inner {
    display: table-cell;
    vertical-align: middle;
    /* text-align: center; */
    position: relative;
}

#home-heading {
    -webkit-animation-delay: .5s;
    animation-delay: .5s;
    position: absolute;
    top: according to ur need 
}

---

您可能需要尝试绝对定位。在内容周围添加一个包装div（我假设它是两个不同的元素，但是如果您向我展示标记，您可以帮我解决这个问题

#主标题{高度：500px；宽度：100%；背景：#000；}
i{color:#fff；}
.文本{
位置：绝对位置；
顶部：30px；
左：0；
文本对齐：居中；
保证金：0自动；
宽度：100%；
}
#主标题h3{
颜色：#fff；
字体大小：40px；
字号：700；
文本对齐：居中；
}
#主标题i{
边缘顶部：300px；
显示：块；
}

标题
雪佛龙

您应该将文本位置链接到页面顶部，而不是使用边距来移动它。您可以使用chevorn进行同样的操作，在其div中添加一个类

更新： 请记住将类别V形添加到V形分区：

我在这方面也做了一些修改：

.chevron{
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    position: absolute;
    left: 50%;
    bottom: 15%;
    width: 80%;
    transform: translateX(-50%);
}

---

你需要在固定导航栏后的内容中添加填充，这在中提到。此外，你的问题应该包含一个。谢谢hungerstar！！现在在小型设备上尝试过它看起来不错，但1200px及更高版本的效果不太好。谢谢你提供的信息！将阅读并进行更多实验。祝你有愉快的一天！感谢Christian提供的信息，我们将查看它今天，稍后让你知道。谢谢vlK！！它工作得很好！！我现在唯一想做的就是让标题在她头上多一点。现在标题离她的头太近了。尝试了利润率上限：20px；但什么都没有发生！只需将主标题h3的顶部值从15%更改为13%或12%或11%，直到你获得最佳位置。谢谢S.！改变了我的头顶H3的值从15%到13%，它工作得很好。但是现在我的雪佛龙在她的鼻子里，所以我尝试了。雪佛龙的底部；10px；但是没有……这是降低我的雪佛龙的方法吗？如果我这样做会影响我的头衔吗？谢谢你检查了你的代码，你不把类雪佛龙添加到你的雪佛龙。div，我已经更新了我的答案，附上了你应该更改的代码的图片。我还更改了.chevron类上的一些道具。非常感谢VlK！做了更改。感谢Omi的帮助，稍后将尝试，看看会发生什么！再次感谢！祝你有一个愉快的一天

.chevron{
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    position: absolute;
    left: 50%;
    bottom: 15%;
    width: 80%;
    transform: translateX(-50%);
}