0
私のウェブサイトの余白を修正したいと思います。私はすべてを試しましたが、これまでに何もできませんでしたhtmlコードやCSSコードに問題があるかもしれません。私は中心のナビゲーションバー内のテキストを整列するためにいくつかのプロパティを追加し、また、いくつかの線形グラデーションを適用しているHtmlページ余白エラー
：
はここに私のサイトのスクリーンショットです。
問題は、液体容器に余白があります。
私が間違っていることがわかりません。どんな助けもありがとう。
ありがとうございます。
.navbar-defaul {
color: #CC3333;
background-color: #CC3333;
}
@font-face {
font-family: Blanch-Condensed;
src: url(BLANCH_CONDENSED.otf);
}
@font-face {
font-family: Hardware-Condensed;
src: url(DDCHardware-Condensed.otf);
}
.Logo {
width: 43%;
height: 43%;
background-size: auto 100%;
background-repeat: no-repeat;
margin: auto;
display: block;
}
#gradiente1 {
background: linear-gradient(rgb(0, 171, 235) 20%, rgba(136, 222, 255, 1.00) 75%);
}
.nav.navbar-nav li a {
color: black;
}
.navbar-default {
margin: auto;
background: greenyellow;
}
.nav.navbar-nav {
display: inline-block;
left: 0;
right: 0;
text-align: center;
width: 100%;
}
.nav.navbar-nav li,
.nav.navbar-nav li a {
display: inline;
float: none;
line-height: 40px;
}
.right.carousel-control {
background: linear-gradient(rgb(0, 171, 235) 10%, rgba(136, 222, 255, 1.00) 75%);
}
.item.active,
.carousel-inner {
background: linear-gradient(rgb(0, 171, 235) 10%, rgba(136, 222, 255, 1.00) 75%);
}<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap librerias1 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<link rel="stylesheet" href="casadelnino.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- Fin de Bootstrap librerias1 -->
<title>Casa Del Niño</title>
<!----jquery script--->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!----jquery script--->
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-md-12" id="gradiente1">
<img src="imagenes/logo - copia.png" class="Logo">
</div>
<div class="row">
<div class="col-md-12">
<nav class="navbar navbar-default">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="#">Conozcanos</a></li>
<li><a href="#">Derechos y Deberes Del Usuario</a></li>
<li><a href="#">Responsabilidad Social</a></li>
<li><a href="#">Correo Corporativo</a></li>
</ul>
</div>
</nav>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicadores -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- plantilla slider -->
<div class="carousel-inner">
<div class="item active">
<img src="imagenes/20130819180519.jpg" class="img-responsive" alt="Cnino1" style="width: 70%; height: 100%; margin:0 auto;">
</div>
<div class="item">
<img src="imagenes/20130819180556.jpg" class="img-responsive" alt="Cnino2" style="width: 70%; height:100%; margin:0 auto">
</div>
<div class="item">
<img src="imagenes/20130819180644.jpg" class="img-responsive" alt="Cnino3" style="width: 70%;height: 100%; margin:0 auto">
</div>
</div>
<!-- Controles del Slide -->
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
私があなたに完全に従っているかどうかはわかりません...あなたは左右の余白があり、余白がないと問題はありますか？ – cwanjt
これは私のページからのキャプチャです –