Html 我是否以错误的方式使我的网站响应？
我使用bootstrap 3.3.7获得html：Html 我是否以错误的方式使我的网站响应？,html,css,bootstrap-modal,Html,Css,Bootstrap Modal,我使用bootstrap 3.3.7获得html： <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="copyright" content=""/> <meta name="author"
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="copyright" content=""/>
<meta name="author" contect="Toki, 2016/12/30"/>
<title>toki</title>
<link rel="shortcut icon" type="image/ico" href="favicon.ico"/>
<link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/bootstrap-theme.min.css"" rel="stylesheet" type="text/css"/>
<link href="assets/css/toki.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class='container'>
<div class='row'>
<img class='bg' src='assets/media/main-bg.jpg'/>
<div class='row'>
<img class='logo' src='assets/media/logo.png'/>
</div>
<div class='row'>
<div class='row'>
<div class='main-content'>
<div class='downloadbox'>
<div class='downloadbtn'>
<a href="#" class='iosdownload'></a>
<a href="#" class='androiddownload'></a>
</div>
<a href='#' class='call-btn'></a>
</div>
</div>
</div>
<div class='row'>
<div class='main-icon'>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<ul class="nav nav-pills nav-justified">
<li data-target="#myCarousel" data-slide-to="0" class="active"><a href="#">Thông Tin game</a></li>
<li data-target="#myCarousel" data-slide-to="1"><a href="#">Tính Năng</a></li>
<li data-target="#myCarousel" data-slide-to="2"><a href="#">Nổi Bật</a></li>
</ul>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="assets/media/ts1.jpg"/>
</div><!-- End Item -->
<div class="item">
<img src="assets/media/ts2.jpg">
</div><!-- End Item -->
<div class="item">
<img src="assets/media/ts3.jpg">
</div><!-- End Carousel Inner -->
</div><!-- End Carousel Inner -->
</div>
</div>
</div>
</div>
</div>
</div>
<script src="assets/js/jquery-1.12.4.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/toki.js"></script>
</body>
</html>
我做错了吗？是的，您在使用引导时做错了 行必须放置在.container或.container流体（全宽）内，以便正确对齐和填充 使用行创建水平列组 内容应该放在列中，只有列可以是行的直接子行。 所以你不能把“行”放在“行”里面。您必须将“col-md-12”用作行的子级。用于获取所需的布局 列通过填充创建檐槽（列内容之间的间隙）。第一列和最后一列的填充在行中通过.rows上的负边距进行偏移
检查引导文档中的网格：是的，您在使用引导时做错了 行必须放置在.container或.container流体（全宽）内，以便正确对齐和填充 使用行创建水平列组 内容应该放在列中，只有列可以是行的直接子行。 所以你不能把“行”放在“行”里面。您必须将“col-md-12”用作行的子级。用于获取所需的布局 列通过填充创建檐槽（列内容之间的间隙）。第一列和最后一列的填充在行中通过.rows上的负边距进行偏移 检查引导文档中的网格：引导使用12列网格系统。整个视图端口分为12个相等的列，可以单独使用或成组使用。它们的使用定义了网站在不同屏幕尺寸下的行为。默认情况下，引导允许四种屏幕大小，分别为xs、sm、md和lg。它们具有不同的像素范围。您必须根据设备屏幕规格使用列。 方法是使用预定义的类“col”。通过附加.col以及屏幕规格和列数，您可以定义div在该屏幕大小下的行为。例如，.col-xs-12.col-sm-3.col-md-5.col-lg-7表示div在xs屏幕上有12列，在sm屏幕上有3列，在md屏幕上有5列，在lg屏幕上有7列。此外，如果您没有提到特定尺寸的规格，它将假定与前一个规格相同。因此，所有这些都可以一起使用，或根据偏好使用 通过以下步骤可以更好地了解该网格布局： 请阅读此处的文档： 引导使用12列网格系统。整个视图端口分为12个相等的列，可以单独使用或成组使用。它们的使用定义了网站在不同屏幕尺寸下的行为。默认情况下，引导允许四种屏幕大小，分别为xs、sm、md和lg。它们具有不同的像素范围。您必须根据设备屏幕规格使用列。 方法是使用预定义的类“col”。通过附加.col以及屏幕规格和列数，您可以定义div在该屏幕大小下的行为。例如，.col-xs-12.col-sm-3.col-md-5.col-lg-7表示div在xs屏幕上有12列，在sm屏幕上有3列，在md屏幕上有5列，在lg屏幕上有7列。此外，如果您没有提到特定尺寸的规格，它将假定与前一个规格相同。因此，所有这些都可以一起使用，或根据偏好使用 通过以下步骤可以更好地了解该网格布局： 请阅读此处的文档：
如果不尝试运行页面，我在HTML中看不到引导列（
.col-col-.col-col-img.bg{
min-height: 100%;
min-width: 1024px;
/* Set up proportionate scaling */
width: 100%;
height: auto;
/* Set up positioning */
position: fixed;
top: 0;
left: 0;
z-index:-999999;
}
.logo{
z-index:1;
}
.header{
text-align: left;
height: 59px;
position: relative;
z-index: 99999;
line-height: 0;
font-size: 12px;
background: url(../media/menu_bg.jpg) repeat-x center center;
}
.main-header{
position: relative;
}
.main-header > div{
float:right;
}
.menu-cant{
padding-right:350px;
}
.menu-game{
padding-right:20px;
}
.dropdown-btn{
color: #666666;
display: block;
width: 139px;
height: 24px;
line-height: 18px;
background: url(../media/scol.jpg) no-repeat center center;
padding: 4px 0 0 15px;
margin-top: 18px;
cursor: pointer;
}
.dropdown-menu{
margin-top:8px;
min-width:140px;
border-radius: 0 !important;
line-height:11px;
}
.dropdown-menu>li>a{
padding: 1px 12px;
}
.link-menu{
display:inline;
padding:20px 30px;
font-size:12px;
}
.link-menu span {
margin: 0 10px 0 0;
padding: 1px 0 0 22px;
display: inline-block;
height: 17px;
line-height: 18px;
font-size:13px;
}
.fanpage-menu{
background: url(../media/heart.jpg) no-repeat 0 center;
}
.fanpage-menu a{
color: #666;
text-decoration: none;
}
.user-menu{
background: url(../media/user.jpg) no-repeat 0 center;
}
.logout-menu{
background: url(../media/logout.jpg) no-repeat 0 center;
}
.login-menu{
background: url(../media/login.jpg) no-repeat 0 center;
}
.new-menu{
padding:30px 30px;
}
.new-menu ul{
width:100px;
list-style:none;
}
.dropdown-menu:before{
position: absolute;
top: -5px;
left: 125px;
display: inline-block;
border-right: 5px solid transparent;
border-bottom: 5px solid #ccc;
border-left: 5px solid transparent;
border-bottom-color: rgba(0, 0, 0, 0.2);
content: '';
}
.dropdown-menu:after {
position: absolute;
top: -4px;
left: 125px;
display: inline-block;
border-right: 5px solid transparent;
border-bottom: 5px solid #ffffff;
border-left: 5px solid transparent;
content: '';
}
.main-content{
padding-top:300px;
width:673px;
}
.downloadbox{
background: url(../media/downloadbg2.png) 0 0 no-repeat;
height: 200px;
padding: 60px 0 0 8px;
position: relative;
left: -8px;
width: 700px;
margin-bottom: 9px;
}
.downloadbtn{
width: 242px;
margin: 10px 0 0 136px;
float: left;
display: inline;
}
.downloadbtn a{
width: 242px;
height: 55px;
display: block;
text-indent: -99999px;
overflow: hidden;
}
.iosdownload{
background: url(../media/iosbtn.png) 0 0 no-repeat;
}
.androiddownload{
margin: 10px 0 0 0;
background: url(../media/androidbtn.png) 0 0 no-repeat;
}
.call-btn{
background: url(../media/monibtn_g.png) 0 0 no-repeat;
width: 115px;
height: 116px;
margin: 10px 0px 0 21px;
float: left;
display: inline;
text-indent: -9999px;
overflow: hidden;
}
.phone-box{
padding:3px 0 15px 238px;
height:70px;
background:url(../media/phonebg.png) 0 0 no-repeat;
margin-bottom:15px;
min-width:700px;
}
.phone-box input.txt{
width:300px;
height:40px;
padding: 0px 6px;
line-height:40px;
border:none;
float:left;
display:inline;
margin-top:13px;
}
.phone-box input.txt:focus{outline:none }
.phone-box input.submit{
width:113px;
height:40px;
border:none;
background:url(../media/submit.jpg) 0 0 no-repeat;
cursor:pointer;
margin-top: 13px;
margin-left: 10px;
}
.main-icon{
width:670px;
}
#myCarousel .nav a small {
display:block;
}
#myCarousel .nav {
background:#eee;
}
#myCarousel .nav a {
border-radius:0px;
}
.carousel-inner{
background-color:#ffffff;
}
.carousel-inner .item img{
padding:10px;
}
@media (max-width: 640px) and (min-width: 320px){
img.bg{
min-width: 640px;
/* Set up proportionate scaling */
width: 100%;
height: auto;
/* Set up positioning */
position: fixed;
top: 0;
left: 0;
z-index:-999999;
background-size:contain;
}
}