当前位置:  开发笔记 > 编程语言 > 正文

导航栏下方的空白区域仅在下一部分中添加到标题时才会消失

如何解决《导航栏下方的空白区域仅在下一部分中添加到标题时才会消失》经验,为你挑选了1个好方法。

我的网页导航栏下面有一个空白区域.我可以让它消失的唯一方法是在下面的标题部分添加边框.我已经多次检查了我的代码,请帮我确定我哪里出错了.我是初学者,所以如果我完全偏离我的结构,请告诉我.

在此代码段中,您只需取消标记标题css即可查看结果.

我真的想知道我在这里做错了什么.谢谢.

body {
	padding: 0;
	margin: 0;
	font-family: 'Josefin Sans', sans-serif;
}

.container {
	max-width: 940px;
	margin: 0 auto;
	padding: 0 10px;
} 


/******************************
			NAV
******************************/
nav {
	background-color: #393D44;
	margin: 0;
	padding: 10px 0;
}

nav ul li {
	list-style: none;
	display: inline-block;
}

nav ul li a {
	text-decoration: none;
	font-weight: 300;
	padding: 15px 10px;
	color: #fff;
}

nav ul li a:hover, .active {
	color: #4BAF70;
}


/******************************
			HEADER
******************************/
header {
	margin: 0;
	background-image: url("http://easylivingmom.com/wp-content/uploads/2012/07/grocery-store-lg.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	height: 600px;
	/*border: 1px solid green;*/

	
		
			Grocery Shopping
			
			
			
		

		
			
			

			

Grocery Shopping

Get Involved

© Brianna Vay 2015

Careers



1> Jinu Kurian..:

Grocery Shopping

的头内有一个margin.尝试删除保证金.

header .container > h1{ margin-top: 0}

这将解决白色空间

PS:在h1标记中添加一个类,仅定位此元素

看到这个

body {

  padding: 0;

  margin: 0;

  font-family: 'Josefin Sans', sans-serif;

}

.container {

  max-width: 940px;

  margin: 0 auto;

  padding: 0 10px;

}

/******************************
    			NAV
    ******************************/

nav {

  background-color: #393D44;

  margin: 0;

  padding: 10px 0;

}

nav ul li {

  list-style: none;

  display: inline-block;

}

nav ul li a {

  text-decoration: none;

  font-weight: 300;

  padding: 15px 10px;

  color: #fff;

}

nav ul li a:hover,

.active {

  color: #4BAF70;

}

/******************************
    			HEADER
    ******************************/

header {

  margin: 0;

  background-image: url("http://easylivingmom.com/wp-content/uploads/2012/07/grocery-store-lg.jpg");

  background-size: cover;

  background-repeat: no-repeat;

  height: 600px;

  /*border: 1px solid green;*/

  

  
    Grocery Shopping
    
    
    
  

  
    


    

Grocery Shopping

Get Involved

© Brianna Vay 2015

Careers

推荐阅读
围脖上的博博_771
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有