嗨,我的编码经验非常少,而且我对此非常陌生,如果这是一个愚蠢的问题,那就很抱歉。我一直在搞乱它,但我无法弄清楚如何阻止这些代码显示在所有页面上:
<!DOCTYPE html>
<html lang="en">
<head>
<body id="imageslide"
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<style>
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
width: 100%;
margin: auto;
}
</style>
</head>
<body>
<div class="container" >
<br>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="https://d2a2wjuuf1c30f.cloudfront.net/product_photos/41163636/gg_201_original.jpg" alt="Chania" width="980" height="345">
</div>
<div class="item">
<img src="https://d1nr5wevwcuzuv.cloudfront.net/product_photos/40913430/gg1_original.jpg" alt="Chania" width="980" height="345">
</div>
</div>
</div>
</body>
</html>
<br>
<br>
<html>
<body>
<body>
<div class="imageslide">
<div style="background-color:#FFC3C3; color:white; padding:1px; text-align:center;">
<h2>Shop By Category</h2>
</div>
</body>
</html>
<br>
我只希望它显示在我的网站主页上,但它出现在每个页面上。代码在布局文件中,因为我需要它出现在页面内容和侧边栏上方。我通过storenvy编辑商店html,如果这有帮助。我可以添加到CSS或HTML的东西,将阻止它出现在主页以外的页面上。提前谢谢!
答案 0 :(得分:0)
请勿使用两个<html>
标记。页面以<html>
开头,以</html>
结尾。
如果您想要在网页上显示多个部分,请使用<div>
&amp; </div>
的开头和结尾div
。
<!DOCTYPE html>
<html lang="en">
<head>
<body id="imageslide" <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<style>
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
width: 100%;
margin: auto;
}
</style>
</head>
<body>
<div class="container">
<br>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="https://d2a2wjuuf1c30f.cloudfront.net/product_photos/41163636/gg_201_original.jpg" alt="Chania" width="980" height="345">
</div>
<div class="item">
<img src="https://d1nr5wevwcuzuv.cloudfront.net/product_photos/40913430/gg1_original.jpg" alt="Chania" width="980" height="345">
</div>
</div>
</div>
<div class="imageslide">
<div style="background-color:#FFC3C3; color:white; padding:1px; text-align:center;">
<h2>Shop By Category</h2>
</div>
</div>
</body>
</html>