html h3周围的未知边界？

时间：2014-11-25 08:34:30

标签： html css

为什么红色div中的H3周围会出现边框，滑块div上也是如此？ 我在css中找不到任何边界代码。

更多文字，以便我可以提交问题

为什么红色div中的H3周围会出现边框，滑块div上也是如此？ 我在css中找不到任何边界代码。

请帮助为什么红色div中的H3周围会出现边框，滑块div上也是如此？ 我在css中找不到任何边界代码。

请帮忙

@charset "utf-8";
/* CSS Document */

.clearfix{ clear:both;}

body{ 
	
		
	 }

@font-face {font-family: Orator Std;
	src: url(fonts/OratorStd.otf);}
	
	
	
@font-face {font-family: Century Gothic;
	src: url(fonts/GOTHIC.TTF);}	

.wrapper{ width:100%; 
		margin-left:auto;
		margin-right:auto;
		 background-image: 
		
		overflow:hidden;
        }
.header{ width:100%;
		height:240;
		margin-bottom:10px;
		background: 
	   
       }
	   
.bannerbox	   {width:100%;
			height:150px;
			padding-top:50px;
			
			; background-color:#FFF;
			
			
			}

.bannercntr{ 
			font-family: "Orator Std";
           }
		   
		   
.bannergothic{font-family:"Century Gothic";
				border: none;}		   
		   
.blockimgs{height:250px;
			 width:250px;
			float:left;
           }

.megablock{width:1000px;
			height:500px;
			margin-left: auto;
			margin-right:auto;
			}

			   
.blockimgsw1{height:250px;
			 width:250px;
			float:left;
			background-image:url(Images/australia.jpg)
           }	   
.blockimgsw1:hover { background-image: url(Images/australia%20-%20Copy.fw.png)}


.blockimgsw2{height:250px;
			 width:250px;
			float:left;
			background-image: url(Images/Canada.jpg)
           }	   
.blockimgsw2:hover { background-image: url(Images/Canada%20-%20Copy.fw.png)}


.blockimgsw3{height:250px;
			 width:250px;
			float:left;
			background-image: url(Images/china.jpg)
           }	   
.blockimgsw3:hover { background-image: url(Images/china%20-%20Copy.fw.png)}

.blockimgsw4{height:250px;
			 width:250px;
			float:left;
			background-image: url(Images/dubai.jpg)
           }	   
.blockimgsw4:hover { background-image: url(Images/dubai%20-%20Copy.fw.png)}


.blockimgsw5{height:250px;
			 width:250px;
			float:left;
			background-image: url(Images/europe.jpg)
           }	   
.blockimgsw5:hover { background-image: url(Images/europe%20-%20Copy.fw.png)}

.blockimgsw6{height:250px;
			 width:250px;
			float:left;
			background-image: url(Images/singapore.jpg)
           }	   
.blockimgsw6:hover { background-image: url(Images/singapore%20-%20Copy.fw.png) }


.blockimgsw7{height:250px;
			 width:250px;
			float:left;
			background-image:url(Images/southAfrica.jpg)
           }	   
.blockimgsw7:hover { background-image: url(Images/southAfrica%20-%20Copy.fw.png)}


.blockimgsw8{height:250px;
			 width:250px;
			float:left;
			background-image: url(Images/USA.jpg)
           }	   
.blockimgsw8:hover { background-image: url(Images/USA%20-%20Copy.fw.png)}

.ddmenubox{width:700px;
			float:right;
           }
.logodiv{float:left;}


<!-----Drop Down Menu---->


ul {list-style: none;padding: 0px;margin: 0px;}
  ul li {display: block;position: relative;float: left;border:1px solid #000;z-index:1}
  li ul {display: none;}
  ul li a {display: block;background: #000;padding: 5px 10px 5px 10px;text-decoration: none;
           white-space: nowrap;color: #fff;}
  ul li a:hover {background: #f00;}
  li:hover ul {display: block; position: absolute;}
  li:hover li {float: none;}
  li:hover a {background: #f00;}
  li:hover li a:hover {background: #000;}
  #drop-nav li ul li {border-top: 0px;}

<!----Drop Down Menu END--->





.rightheader{float:right;
				height:240px;
				width:500px;}

.horilist{ float:left;
    list-style:none;
	font-family:"Century Gothic";
	font-size:30px;
	font-weight:800;
	padding-right:20px;
	margin:0px auto;
	}
	
.subbox	{width:1000px;
         height:280px;
		 padding-top:20px;
		 background-image:url(Images/matte-red.jpg);
		 background-repeat:repeat;
		
		 overflow:hidden;
        }


<!-----SLIDER---->

.banner { position: relative; overflow: auto;  }
    .banner li { list-style: none; height:400px;}
        .banner ul li { float: left; }

<!-----SLIDER--END---->
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Travel the World</title>

<link rel="stylesheet" type="text/css" href="main.css">



<!-----Slider----->



	<!-----Slider  end---->


</head>




<body>

<div class="header"> <div class="logodiv"> <img src="Images/One.png">  </div>

	<div class="ddmenubox">

<ul id="drop-nav">
  <li><a href="#">Support</a></li>
  <li><a href="#">Web Design</a>
    <ul>
      <li><a href="#">HTML</a></li>
      <li><a href="#">CSS</a></li>
      <li><a href="#">JavaScript</a></li>
    </ul>
  </li>
  <li><a href="#">Content Management</a>
    <ul>
      <li><a href="#">Joomla</a></li>
      <li><a href="#">Drupal</a></li>
      <li><a href="#">WordPress</a></li>
      <li><a href="#">Concrete 5</a></li>
    </ul>
  </li>
  <li><a href="#">Contact</a>
    <ul>
      <li><a href="#">General Inquiries</a></li>
      <li><a href="#">Ask me a Question</a></li>
    </ul>
  </li>
</ul>

	</div>


</div>



<div class="wrapper">
<!---Insert Slider---->	
		
        <div class="banner">
    <ul>
        <li style="background-image:url(Images/002.jpg)">This is a slide.</li>
        <li>This is another slide.</li>
        <li>This is a final slide.</li>
    </ul>
</div>
        

		
<!------SLIDER AREA END---->    
    
    <div class="bannerbox">
    <center>
   
   <h3 class="bannergothic">You can simple dream a great vacation. But it is a tough job to make it into a reality and to find <br>a travel company who delightfully crafts your trip. <br>At One World Holidayz we make it our pleasure to transform your dream holiday into a reality.</h3>
   
    </center>
    </div>
    
    <div class="megablock">
    <div class="blockimgsw1">
    
    </div>
    
    <div class="blockimgsw2">
    
    </div>
    
    <div class="blockimgsw3">
    
    </div>
   
    <div class="blockimgsw4">
   
    </div>
    
    <div class="blockimgsw5">
    
    </div>
    
    <div class="blockimgsw6">
    
    </div>
    
    <div class="blockimgsw7">
    
    </div>
    
    <div class="blockimgsw8">
   
    </div>
    
    </div>
    <div class="clearfix"></div>
    
  <div class="bannerbox">
    <center>
   <h2 class="bannercntr"> ADVENTURE IS EVERYWHERE </h2>
   <h3 class="bannergothic"> You can simple dream a great vacation. But it is a tough job to make it into a reality and to find a travel company who delightfully crafts your trip. At One World Holidayz we make it our pleasure to transform your dream holiday into a reality.</h3>
   
    </center>
    </div>


	<div class="subbox">
    <ul class="horilist">
    <li class="horilist">
    China
    </li>
    <li class="horilist">
    Australia
    </li>
    <li class="horilist">
    Canada
    </li>
    
    <li class="horilist">
    Dubai
    </li>
    
    <li class="horilist">
    New Zealand
    </li>
    
    <li class="horilist">
    Europe
    </li>
    </ul>
    
    <ul>
    <li class="horilist">
    Hong Kong
    </li>
    
    <li class="horilist">
    Asia
    </li>
    
      
    
    <li class="horilist">
    USA
    </li>
    
    <li class="horilist">
    South Africa
    </li>
    
    <li class="horilist">
    United Kingdom
    </li>
    
    
    </ul>
    
    </div>
    
    
    
</div>






<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://unslider.com/unslider.min.js"></script>

<script>

$(document).ready(function(){ 
    $('.banner').unslider();
});

</script>


</body>
</html>

1 个答案:

答案 0 :(得分：0)

你有你的

ul li{
    display: block;
    position: relative;
    float: left;
    border: 1px solid #000;
    z-index: 1;
}

边框1px使滑块保持边框。所以只需删除边框或只删除em 0即可使用没有边框的滑块。

相关问题
最新问题