我正在尝试使用html背景和身体背景作为不同。当我使用体色时,它不会覆盖索引页面的整个页面。但它适用于其他页面! 这是我的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset = "UTF-8">
<title>Welcome to NY All STAR's offical website</title>
<meta name ="Description" content="NYAS">
<meta name="Description" content = "A_New_York_based_cricket_club">
<meta name="tag" content ="NYPCL,nyas">
<meta name ="tag" content="cricket">
<link rel="stylesheet" type="text/css" href="index.css">
<link rel="stylesheet" type="text/css" href="home.css">
</head>
<body>
<header>
<img src="images/logo.png" width=1200 height=300 alt="All star">
</header>
<br>
<nav class="navv">
<ul class="nav-list">
<li id="current" class="nav-item"><a href="index.html">HOME</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="#">PLAYERS</a>
<ul class="nav-submenu">
<li class="nav-submenu-item"><a href="abir.html">Abir Khan</a></li>
<li class="nav-submenu-item"><a href="afzal.html">Afzal Hossain</a> </li>
<li class="nav-submenu-item"><a href="polash.html">Ashfaqur Rahman</a></li>
<li class="nav-submenu-item"><a href="ashraf.html">Ashrafur Rahman</a></li>
<li class="nav-submenu-item"><a href="azad.html">Azad Ahmed</a></li>
<li class="nav-submenu-item"><a href="jibran.html">Jibran Khan</a></li>
<li class="nav-submenu-item"><a href="junayed.html">Junayed Ahmed</a></li>
<li class="nav-submenu-item"><a href="korban.html">Korban Ali</a></li>
<li class="nav-submenu-item"><a href="shaikot.html">MD. Shaikot Alom</a></li>
<li class="nav-submenu-item"><a href="tanmoy.html">MD Tanmoy Hossain</a></li>
<li class="nav-submenu-item"><a href="suleman.html">Mohammed Suleman</a></li>
<li class="nav-submenu-item"><a href="monju.html">Monirul Haque</a></li>
<li class="nav-submenu-item"><a href="monju.html">Monjur Hussain</a></li>
<li class="nav-submenu-item"><a href="maju.html">Muazam Hussain</a></li>
<li class="nav-submenu-item"><a href="mustafizur.html">Mustafizur Rahman</a></li>
<li class="nav-submenu-item"><a href="pervej.html">Pervej Rahman</a></li>
<li class="nav-submenu-item"><a href="prashant.html">Prashant Nair</a></li>
<li class="nav-submenu-item"><a href="shuvo.html">Rakib Shuvo</a></li>
<li class="nav-submenu-item"><a href="sami.html">Sami Chowdhury</a></li>
<li class="nav-submenu-item"><a href="sanjil.html">Sanjil Chowdhury</a></li>
<li class="nav-submenu-item"><a href="saqif.html">Saqif Haider</a></li>
</ul>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="news.html">NEWS</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="schedule.html">SCHEDULE</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="result.html">RESULT</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="stats.html">STATS</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="#">MEDIA</a>
<ul class="nav-submenu">
<li class="nav-submenu-item"><a href="?=submenu-1">PHOTO</a></li>
<li class="nav-submenu-item"><a href="?=submenu-2">VIDEO</a></li>
</ul>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="links.html">LINKS</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="#">LIVE STREAM</a>
<ul class="nav-submenu">
<li class="nav-submenu-item"><a href="livecricket.html">LIVE CRICKET</a></li>
<li class="nav-submenu-item"><a href="banglaradio.html">LIVE RADIO</a></li>
</ul>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="about.html">ABOUT US</a>
</li>
</ul>
<aside >
<div class="widget" >
<p><script type="text/javascript" src="http://voap.weather.com/weather/oap/USNY0996?template=GENXH&par=3000000007&unit=0&key=twciweatherwidget"></script></p>
</div>
</aside>
<!--Beginning of photo Slideshow -->
<div class ="left"> <!--bordered slideshow here-->
<ul class="slides">
<input type="radio" name="radio-btn" id="img-1" checked />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_1.jpg" />
<div class="caption">
<h2>T-20 Champion 2013</h2>
</div>
</div>
<div class="nav">
<label for="img-6" class="prev">‹</label>
<label for="img-2" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-2" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_2.JPG" />
</div>
<div class="nav">
<label for="img-1" class="prev">‹</label>
<label for="img-3" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-3" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_3.JPG" />
</div>
<div class="nav">
<label for="img-2" class="prev">‹</label>
<label for="img-4" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-4" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_4.JPG" />
</div>
<div class="nav">
<label for="img-3" class="prev">‹</label>
<label for="img-5" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-5" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_5.JPG" />
</div>
<div class="nav">
<label for="img-4" class="prev">‹</label>
<label for="img-6" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-6" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_6.JPG" />
</div>
<div class="nav">
<label for="img-5" class="prev">‹</label>
<label for="img-1" class="next">›</label>
</div>
</li>
<li class="nav-dots">
<label for="img-1" class="nav-dot" id="img-dot-1">
</label>
<label for="img-2" class="nav-dot" id="img-dot-2">
</label>
<label for="img-3" class="nav-dot" id="img-dot-3">
</label>
<label for="img-4" class="nav-dot" id="img-dot-4">
</label>
<label for="img-5" class="nav-dot" id="img-dot-5">
</label>
<label for="img-6" class="nav-dot" id="img-dot-6">
</label>
</li>
</ul>
</div>
<!--End of Photo Slideshow -->
<br>
<section >
<div class="welcome">
<h3>Welcome to NYAS</h3>
<p>
<em>NY All STAR</em> is a cricket club which is made up of young cricketers
who are highly determined and focused in their game. This club
joined BCANA League in 2011.
</p>
<p> In 2013, NY All STAR Participated in NYPCL and won the t20 first division league. They also became the League <b>Runners-up</b> of Division A.
</p>
</div>
</section>
<br>
<footer>
<!-- footer -->
<div id="f" class="clearfix">
<div class="col">
<ul class="btm-left">
<li><img src="images/logo.png" height="150" width="160"/></li>
</ul>
</div>
<div class="col">
<ul class="btm-center">
<li><iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fnyascc&width=450&height=395&colorscheme=light&show_faces=false&header=false&stream=true&show_border=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:395px;" allowTransparency="true"></iframe></li>
</ul>
</div>
<div class="col">
<ul class="btm-right">
<li><b>Links</b></li>
<li><a href="#">HOME</a></li>
<li><a href="news.html">NEWS</a></li>
<li><a href="schedule.html">SCHEDULE</a></li>
<li><a href="result.html">RESULT</a></li>
<li><a href="stats.html">STATS</a></li>
<li><a href="#">PLAYERS</a></li>
<li><a href="links.html">LINKS</a></li>
<li><a href="livecricket.html">LIVE CRICKET</a></li>
<li><a href="banglaradio.html">LIVE RADIO</a></li>
<li><a href="about.html">ABOUT US</a></li>
</ul>
</div>
</div>
</footer>
<!-- @end footer -->
</body>
</html>
Css代码在这里:
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
border: 2px solid black;
background: #F0F0F0;
background-size: cover;
font-size: 87.5%;
width: 1200px;
margin-left: 15px;
margin: 15px auto;
padding: 15px 25px;
display: block;
border: 1px solid black;
}
请给我一个解决方案,为什么会这样。
以下是您可以查看的链接:http://cst2309.hostei.com/
谢谢
答案 0 :(得分:1)
这种情况正在发生,因为你给身体提供了15px的保证金。不要给身体任何边缘或填充物。而是为其中的元素提供填充和边距。
答案 1 :(得分:0)
您没有结束标记。这可能是因为浏览器试图找到每个主标记的省略标记。试试这个:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset = "UTF-8">
<title>Welcome to NY All STAR's offical website</title>
<meta name ="Description" content="NYAS">
<meta name="Description" content = "A_New_York_based_cricket_club">
<meta name="tag" content ="NYPCL,nyas">
<meta name ="tag" content="cricket">
<link rel="stylesheet" type="text/css" href="main.css">
<link rel="stylesheet" type="text/css" href="home.css">
</head>
<body>
<header>
<img src="images/logo.png" width=1200 height=300 alt="All star">
</header>
<br>
<nav class="navv">
<ul class="nav-list">
<li id="current" class="nav-item"><a href="index.html">HOME</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="#">PLAYERS</a>
<ul class="nav-submenu">
<li class="nav-submenu-item"><a href="abir.html">Abir Khan</a></li>
<li class="nav-submenu-item"><a href="afzal.html">Afzal Hossain</a> </li>
<li class="nav-submenu-item"><a href="polash.html">Ashfaqur Rahman</a></li>
<li class="nav-submenu-item"><a href="ashraf.html">Ashrafur Rahman</a></li>
<li class="nav-submenu-item"><a href="azad.html">Azad Ahmed</a></li>
<li class="nav-submenu-item"><a href="jibran.html">Jibran Khan</a></li>
<li class="nav-submenu-item"><a href="junayed.html">Junayed Ahmed</a></li>
<li class="nav-submenu-item"><a href="korban.html">Korban Ali</a></li>
<li class="nav-submenu-item"><a href="shaikot.html">MD. Shaikot Alom</a></li>
<li class="nav-submenu-item"><a href="tanmoy.html">MD Tanmoy Hossain</a></li>
<li class="nav-submenu-item"><a href="suleman.html">Mohammed Suleman</a></li>
<li class="nav-submenu-item"><a href="monju.html">Monirul Haque</a></li>
<li class="nav-submenu-item"><a href="monju.html">Monjur Hussain</a></li>
<li class="nav-submenu-item"><a href="maju.html">Muazam Hussain</a></li>
<li class="nav-submenu-item"><a href="mustafizur.html">Mustafizur Rahman</a></li>
<li class="nav-submenu-item"><a href="pervej.html">Pervej Rahman</a></li>
<li class="nav-submenu-item"><a href="prashant.html">Prashant Nair</a></li>
<li class="nav-submenu-item"><a href="shuvo.html">Rakib Shuvo</a></li>
<li class="nav-submenu-item"><a href="sami.html">Sami Chowdhury</a></li>
<li class="nav-submenu-item"><a href="sanjil.html">Sanjil Chowdhury</a></li>
<li class="nav-submenu-item"><a href="saqif.html">Saqif Haider</a></li>
</ul>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="news.html">NEWS</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="schedule.html">SCHEDULE</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="result.html">RESULT</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="stats.html">STATS</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="#">MEDIA</a>
<ul class="nav-submenu">
<li class="nav-submenu-item"><a href="?=submenu-1">PHOTO</a></li>
<li class="nav-submenu-item"><a href="?=submenu-2">VIDEO</a></li>
</ul>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="links.html">LINKS</a>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="#">LIVE STREAM</a>
<ul class="nav-submenu">
<li class="nav-submenu-item"><a href="livecricket.html">LIVE CRICKET</a></li>
<li class="nav-submenu-item"><a href="banglaradio.html">LIVE RADIO</a></li>
</ul>
</li>
</ul>
<ul class="nav-list">
<li class="nav-item"><a href="about.html">ABOUT US</a>
</li>
</ul>
</nav>
<aside >
<div class="widget" >
<p><script type="text/javascript" src="http://voap.weather.com/weather/oap/USNY0996?template=GENXH&par=3000000007&unit=0&key=twciweatherwidget"></script></p>
</div>
</aside>
<!--Beginning of photo Slideshow -->
<div class ="left"> <!--bordered slideshow here-->
<ul class="slides">
<input type="radio" name="radio-btn" id="img-1" checked />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_1.jpg" />
<div class="caption">
<h2>T-20 Champion 2013</h2>
</div>
</div>
<div class="nav">
<label for="img-6" class="prev">‹</label>
<label for="img-2" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-2" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_2.JPG" />
</div>
<div class="nav">
<label for="img-1" class="prev">‹</label>
<label for="img-3" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-3" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_3.JPG" />
</div>
<div class="nav">
<label for="img-2" class="prev">‹</label>
<label for="img-4" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-4" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_4.JPG" />
</div>
<div class="nav">
<label for="img-3" class="prev">‹</label>
<label for="img-5" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-5" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_5.JPG" />
</div>
<div class="nav">
<label for="img-4" class="prev">‹</label>
<label for="img-6" class="next">›</label>
</div>
</li>
<input type="radio" name="radio-btn" id="img-6" />
<li class="slide-container">
<div class="slide">
<img src="images/slideshow/img_6.JPG" />
</div>
<div class="nav">
<label for="img-5" class="prev">‹</label>
<label for="img-1" class="next">›</label>
</div>
</li>
<li class="nav-dots">
<label for="img-1" class="nav-dot" id="img-dot-1">
</label>
<label for="img-2" class="nav-dot" id="img-dot-2">
</label>
<label for="img-3" class="nav-dot" id="img-dot-3">
</label>
<label for="img-4" class="nav-dot" id="img-dot-4">
</label>
<label for="img-5" class="nav-dot" id="img-dot-5">
</label>
<label for="img-6" class="nav-dot" id="img-dot-6">
</label>
</li>
</ul>
</div>
<!--End of Photo Slideshow -->
<br>
<section >
<div class="welcome">
<h3>Welcome to NYAS</h3>
<p>
<em>NY All STAR</em> is a cricket club which is made up of young cricketers
who are highly determined and focused in their game. This club
joined BCANA League in 2011.
</p>
<p> In 2013, NY All STAR Participated in NYPCL and won the t20 first division league. They also became the League <b>Runners-up</b> of Division A.
</p>
</div>
</section>
<br>
</body>
</html>