Html 引导完全视口div合并到另一个视口div

我正在使用3个完整的viewport

div

<div class="vw-100 vh-100 bg-3 white">
            
           </div>

正文{
字体系列：“Raleway”，无衬线；
}
.bg-1{
背景色：#bd2130；
背景图片：url（images/bg-1.jpg）；
背景尺寸：封面；
}
.bg-2{
背景色：蓝紫色；
背景图片：url（images/bg-2.jpg）；
背景尺寸：封面；
}
.bg-3{
背景色：#ff9c08；
背景图片：url（images/contact orange.png）；
背景尺寸：封面；
}
怀特先生{
颜色：白色；
}
布莱克先生{
颜色：黑色；
}
瑞德先生{
颜色：#fd7878；
}
布朗先生{
颜色：#ca793f；
}
蓝先生{
颜色：#00adff；
}
.按钮1{
显示：内联块；
背景：无；
填充：10px 10px；
边框：2倍纯白；
边界半径：5px；
字体大小：20px；
宽度：200px；
高度：60px；
}
B.班纳内容{
宽度：100%；
填充顶部：35vh；
文本对齐：居中；
背景图像：；
垂直对齐：中间对齐；
}
.padding50{
填充顶部：50px；
}
.padding100{
填充顶部：100px；
}
.填充10{
填充顶部：10px；
}
.填充20{
填充顶部：20px；
}
.padding20 img{/**添加用于演示**/
最大宽度：40px；/**为演示添加**/
}/**为演示添加**/
.填充10{
左侧填充：10px；
}
伊科恩先生{
宽度：110px；
高度：110px；
显示：内联块；
文本对齐：居中；
线高：104px；
边框：3px实心#fff；
边界半径：50%；
背景色：#f7c552；
}
.图标圈{
宽度：125px；
高度：125px；
显示：内联块；
背景：f8f8ffad；
边框：3倍纯黑；
边界半径：50%；
}

需要一个网站吗？我们会帮助你的



现在创建网站的过程就像喝一杯咖啡一样简单。只要给我们打个电话就行了
我们确保它不会破坏您的食欲。超负担得起的预算计划和更新
一流的预算友好且快速，但也丰富且充足。令人惊叹的网站前所未有

修复完成

因此，您应该将：

vw-100

替换为

w-100

，否则它将设置一个水平滚动条

然后我用一个创建的类替换了所有的

vh-100

，以确保高度保持不变：

.min-vh-100{
  min-height: 100vh;
}

演示：

var TxtType=函数（el、toRotate、句点）{
this.toRotate=toRotate；
this.el=el；
this.loopNum=0；
this.period=parseInt（period，10）| 2000；
this.txt=“”；
这个。勾选（）；
this.isDeleting=false；
};
TxtType.prototype.tick=函数（）{
var i=this.loopNum%this.toRotate.length；
var fullTxt=this.toRotate[i]；
如果（这是删除）{
this.txt=fullTxt.substring（0，this.txt.length-1）；
}否则{
this.txt=fullTxt.substring（0，this.txt.length+1）；
}
this.el.innerHTML=''+this.txt+''；
var=这个；
var delta=200-Math.random（）*100；
如果（this.isDeleting）{delta/=2；}
如果（！this.isDeleting&&this.txt===fullTxt）{
delta=这个周期；
this.isDeleting=true；
}else if（this.isDeleting&&this.txt==''）{
this.isDeleting=false；
这个.loopNum++；
δ=500；
}
setTimeout（函数（）{
那。勾选（）；
}，三角洲）；
};
window.onload=函数（）{
var elements=document.getElementsByClassName（'typewrite'）；
对于（var i=0；i

请分享更多代码，并用index.html更新。希望现在一切正常。谢谢。你有一些不是BS的类。请分享这些类以及添加的CSS和JS文件。几乎一切都很完美。在第二行，修改后的图标和文本很小。有点太大的空白。我可以接受。但是我如果您有任何相同的建议，我将很乐意倾听。谢谢。对于图标，我只是为演示添加了css，正如css中提到的：

。padding20 img{/**ADDED For demo**/max width:40px；/**ADDED For demo**/}

所以您不应该拿这个