Question

基本上我的col不起作用或者我做的不对吗？这是我附上的图像 P.S。：我是一个带引导程序的新手刚开始使用它所以请不要生小错误。我正在使用Bootstrap版本4 Img here with the problem

这是我的代码

  <body>
 <header>
 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  <a class="navbar-brand" href="#"><img src="images/amf-logo.jpg" 
 alt="amfLogo" 
 width="130px" height="40px"></a>
 <button class="navbar-toggler" type="button" data-toggle="collapse" data-
 target="#navbarSupportedContent" aria-controls="navbarSupportedContent" 
 aria-expanded="false" aria-label="Toggle navigation">
 <span class="navbar-toggler-icon"></span>
 </button>

 <div class="collapse navbar-collapse" id="navbarSupportedContent">
  <ul class="navbar-nav mr-auto">
   <li class="nav-item active">
     <a class="nav-link" href="#">Home <span class="sr-only">(current)</span>
</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Galerie</a>
  </li>
 <li class="nav-item">
    <a class="nav-link" href="#">Contact</a>
  </li>
</nav>

  <div class="container">
  <div class="row">
    <div class="col-md-3 col-sm-4"> <!-- you must close this -->

        <p> 


   acxzcxzcxzcxzvcxzvcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxz 

</p>

    </div>
    <div class="col-md-3 col-sm-4"

        <p> azcxxxxxxxxxxxxxxxxxxxxsdazcxxxxx </p>

    </div>
    </div>
 </div> 



<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" 
 integrity="sha384-
 KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" 
crossorigin="anonymous"></script>
<script 
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" 
integrity="sha384-
vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" 
crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-
beta.2/js/bootstrap.min.js" integrity="sha384-
alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" 
crossorigin="anonymous"></script>

Answer 1

我将代码放入codepen中，页面显示正确。亲眼看看：

https://codepen.io/dakata911/pen/mqagWO

I think this works fine.    :)

Answer 2

试试这个...... 如果这不起作用，请告诉我您正在查看的屏幕大小。

     <body>
 <header>
 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  <a class="navbar-brand" href="#"><img src="images/amf-logo.jpg" 
 alt="amfLogo" 
 width="130px" height="40px"></a>
 <button class="navbar-toggler" type="button" data-toggle="collapse" data-
 target="#navbarSupportedContent" aria-controls="navbarSupportedContent" 
 aria-expanded="false" aria-label="Toggle navigation">
 <span class="navbar-toggler-icon"></span>
 </button>

 <div class="collapse navbar-collapse" id="navbarSupportedContent">
  <ul class="navbar-nav mr-auto">
   <li class="nav-item active">
     <a class="nav-link" href="#">Home <span class="sr-only">(current)</span>
</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Galerie</a>
  </li>
 <li class="nav-item">
    <a class="nav-link" href="#">Contact</a>
  </li>
</nav>

  <div class="container-fluid">
  <div class="row">
    <div class="col-md-3 col-sm-4"> <!-- you must close this -->

        <p> 


   acxzcxzcxzcxzvcxzvcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxz 

</p>

引导意外结果？

2 个答案: