Zurb基础柱宽度不工作



我有下面的代码片段,列的宽度应该是工作的,但不知何故,它没有发生,两个div与列类将在下一行。

<html>
<head>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/css/foundation.min.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/js/foundation.min.js"></script>  
</head>
<body> 
    <div class="row">
        <div class="large-8 columns"> Hello </div>
        <div class="large-4 columns">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent pellentesque metus vitae felis bibendum.
    </div>
</body> 
</html>

您的foundation.min.css链接需要有一个rel="stylesheet"属性来指定它是一个样式表关系。否则它不会被用作一个。您的large-8列线也缺少关闭</div>

<html>
  <head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/css/foundation.min.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/js/foundation.min.js"></script>
  </head>
  <body>
    <div class="row">
      <div class="small-2 columns"> Hello </div>
      <div class="small-10 columns">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent pellentesque metus vitae felis bibendum.</div>
    </div>
  </body>
</html>`

相关内容

  • 没有找到相关文章

最新更新