标题和静态图像之间的Html间隙

我一直在尝试在我的网站上使用静态图像，但是标题和图像之间有很大的差距，我尝试在Photoshop和HTML中删除填充并更改图像高度。 这是我的一个小问题

部分。模块：最后一个子模块{
页边距底部：0；
}
第2节模块h2{
字体系列：“Roboto Slab”，衬线；
字体大小：30px；
}
第4.p节模块{
边缘底部：40px；
字体大小：16px；
字体大小：300；
}
第4.p节：最后一个孩子{
页边距底部：0；
}
第节模块内容{
填充：40px0；
颜色：#090C02；
}
第节.模块.内容#第1节{
背景色：#b23783；
}
章节.模块.内容#章节2{
背景色：#3783b2；
}
第节视差模块{
高度：600px；
背景位置：50%50%；
背景重复：无重复；
背景附件：固定；
背景尺寸：封面；
}
节.模块.视差h1{
颜色：#8FD5A6；
字体大小：48px；
线高：600px；
字号：700；
文本对齐：居中；
文本转换：大写；
文本阴影：0 10px rgba（0,0,0,0.2）；
字体系列：“Julius Sans One”，无衬线；
}
第1节视差模块-1{
背景图像：url（“https://i.imgur.com/YpRAOt3.jpg");
}
@介质和全部（最小宽度：600px）{
第2节模块h2{
字体大小：42px；
}
第4.p节模块{
字体大小：20px；
}
节.模块.视差h1{
字体大小：96px；
}
}
@介质和全部（最小宽度：960像素）{
节.模块.视差h1{
字体大小：160px；
}
}
.标题ul{
列表样式类型：无；
保证金：0；
填充：0；
溢出：隐藏；
背景色：#1E20；
}
李局长{
浮动：对；
文本对齐：中间对齐；
}
李安{
显示：块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
字体系列：“苦”，衬线；
}
.头李：悬停{
背景色：#fec10e；
颜色：黑色；
}

例子

这称为“页边距折叠”。

h1

上的页边距顶部正在父级外部折叠

父级和第一个/最后一个子级-如果没有创建边框、填充、内联内容、块\u格式\u上下文或清除以将块的页边距顶部与其第一个子块的页边距顶部分开，或者没有边框、填充、内联内容、高度、最小高度，或“最大高度”将块的边距底部与其最后一个子块的边距底部分开，然后这些边距将塌陷。折叠的页边距最终位于父页边距之外

部分。模块：最后一个子模块{
页边距底部：0；
}
第2节模块h2{
字体系列：“Roboto Slab”，衬线；
字体大小：30px；
}
第4.p节模块{
边缘底部：40px；
字体大小：16px；
字体大小：300；
}
第4.p节：最后一个孩子{
页边距底部：0；
}
第节模块内容{
填充：40px0；
颜色：#090C02；
}
第节.模块.内容#第1节{
背景色：#b23783；
}
章节.模块.内容#章节2{
背景色：#3783b2；
}
第节视差模块{
高度：600px；
背景位置：50%50%；
背景重复：无重复；
背景附件：固定；
背景尺寸：封面；
}
节.模块.视差h1{
颜色：#8FD5A6；
字体大小：48px；
线高：600px；
字号：700；
文本对齐：居中；
文本转换：大写；
文本阴影：0 10px rgba（0,0,0,0.2）；
字体系列：“Julius Sans One”，无衬线；
边际上限：0；
}
第1节视差模块-1{
背景图像：url（“https://i.imgur.com/YpRAOt3.jpg");
}
@介质和全部（最小宽度：600px）{
第2节模块h2{
字体大小：42px；
}
第4.p节模块{
字体大小：20px；
}
节.模块.视差h1{
字体大小：96px；
}
}
@介质和全部（最小宽度：960像素）{
节.模块.视差h1{
字体大小：160px；
}
}
.标题ul{
列表样式类型：无；
保证金：0；
填充：0；
溢出：隐藏；
背景色：#1E20；
}
李局长{
浮动：对；
文本对齐：中间对齐；
}
李安{
显示：块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
字体系列：“苦”，衬线；
}
.头李：悬停{
背景色：#fec10e；
颜色：黑色；
}

例子

检查代码后，您可以注意到“section.module.parallax h1”的边距顶部为40px。 您需要使用此选项（边距顶部：0）来消除间隙