Javascript 在不影响其他元素的情况下将两者结合起来

在这里，我有一个摄影作品集和顶部导航栏分别建立。但是当我尝试组合它时，样式会改变吗？为什么会这样？有没有人能帮我在不改变造型的情况下将两者结合起来。非常感谢你。非常感谢你。多谢各位

@导入url（'https://fonts.googleapis.com/css?family=Roboto+浓缩’）；
* {
填充：0；
保证金：0；
框大小：边框框；
}
身体{
字体系列：“Roboto Condensed”，无衬线；
保证金：0；
背景色：#fefdfc；
背景图像：线性梯度（315度，#fefdfc 0%，#473146 74%）；
高度：自动；
}
html{
滚动行为：平滑；
}
h1{
颜色：白色；
字体大小：400；
字体大小：2.5rem；
文本阴影：黑色3px 3px；
文本转换：大写；
保证金：0；
}
氢{
字体大小：400；
字号：1.2rem；
文本转换：大写；
保证金：0；
}
img{
显示：块；
宽度：100%；
}
主要{
最大宽度：1200px；
保证金：自动；
盒影：30px0px40pxrgba（0,0,0,0.1），-30px0px40pxrgba（0,0,0.1）；
}
#降落{
背景色：#000000；
背景图像：线性梯度（147deg，#0000000%，#04619f 74%）；
}
#登录文本{
显示器：flex；
弹性：01 40vw；
高度：50vh；
证明内容：中心；
对齐项目：居中；
文本对齐：居中；
右侧填充：1rem；
左：1rem；
}
#登录文本h2{
颜色：#b91300；
}
#着陆图像{
背景：url（/images/camera.webp）；
背景位置：中心；
背景尺寸：封面；
背景重复：无重复；
高度：50vh；
弹性：01 60vw；
保证金：0；
}
.btn{
填充：0.5rem 2rem；
边框：1px#ccc实心；
显示：内联块；
保证金：2Rem0；
边界半径：50px；
文字装饰：无；
颜色：rgb（0,0,0）；
过渡：背景500毫秒；
}
.btn:悬停{
背景：#000000；
颜色：#fff；
转换：比例（1.11）；
过渡：均为0.6s；
}
#标题{
填充：1.5雷姆；
文本对齐：居中；
背景色：#000000；
背景图像：线性梯度（147deg，#0000000%，#434374%）；
颜色：#fff；
}
#收割台h2{
左边框：虚线1px#fff；
右边框：虚线1px#fff；
显示：内联块；
右侧填充：1rem；
左：1rem；
}
.标题{
填充：0.8rem；
文本对齐：居中；
背景：#000000；
不透明度：0.9；
颜色：#fff；
}
页脚{
文本对齐：居中；
填充：2rem1rem；
保证金：自动；
颜色：rgb（0,0,0）；
}
页脚h3{
字体大小：3rem；
页边距底部：0；
}
.社会部分{
右边填充：20px；
颜色：白色；
光标：指针；
}
ullia{
右边距：20px；
}
.navcolor{
背景色：rgb（0,0,0）；
}
.下拉菜单{
边界半径：10px；
}
/*屏幕尺寸500px及以上*/
@介质（最小宽度：500px）{
#降落{
显示器：flex；
身高：100%；
}
#登录文本{
高度：100vh；
}
#着陆图像{
高度：100vh；
}
}
/*屏幕尺寸700px及以上*/
@介质（最小宽度：700px）{
.btn{
填充：1rem 3rem；
}
}

纳文Jc摄影
纳文
摄影
美丽的自然摄影
我们的工作
照片一
我的同僚们都是精英。特尼图尔

照片二
我的同僚们都是精英。特尼图尔

照片三
我的同僚们都是精英。特尼图尔

照片四
我的同僚们都是精英。特尼图尔

照片五
我的同僚们都是精英。特尼图尔

联系
通过电子邮件或电话向我们咨询

电邮：
contact@jc.lensational

电话：
（617）212-5267

导航栏
纳文Jc摄影









$（文档）.ready（函数（）{
$（'.navbar light.dmenu'）。悬停（函数（）{
$（this）.find（'.sm menu'）.first（）.stop（true，true）.slideDown（150）；
}，函数（）{
$（this）.find（'.sm menu'）.first（）.stop（true，true）.slideUp（105）
});
});

请先阅读

您尝试放置两个html文档