gpt4 book ai didi

HTML/CSS : Foundation stylesheet wont link

转载 作者:行者123 更新时间:2023-11-28 03:24:15 26 4
gpt4 key购买 nike

我试图让基础框架链接到我的 HTML 页面,但是当我尝试使用网格系统时,它没有做任何事情。我已经查看了几个不同的教程以确保我正确地链接了东西,但我仍然无法弄清楚为什么它不起作用。这是我的编辑器的图像,并排显示。我的 index.html、css 文件夹和 js 文件夹都包含在同一个目录中。 Editor and Display

enter image description here

同时附上我的代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<meta http-equiv="x-ua-compatible" content="ie=edge"/>
<meta name="viewport" content="device=device-width, initial-scale=1.0"/>
<title>Foundation | Welcome</title>
<link rel="stylesheet" href="css/foundation.min.css"/>
<link rel="stylesheet" href="css/app.css"/>
</head>

<body>
<div class="row">
<div class="large-4 columns" style="background-color: lightblue"><p>Why u wont work.</p></div>
<div class="large-8 collumn" style="background-color: lightsalmon">Not displaying a grid system.</div>
</div>

<!-- include before </body> tag -->
<script src="js/vendor/jquery.min.js"></script>
<script src="js/vendor/what-input.min.js"></script>
<script src="js/foundation.min.js"></script>
<script src="js/app.js"></script>
</body>
</html>

最佳答案

首先,你打错了,它说collumn,应该是column(或columns)。

其次,请确保您使用的是正确的网格,Foundation 6.4 有 3 个网格可用:XY(默认)、 float 和 flex 。

您示例中的代码属于“传统” float 网格,而此新版本(自 6 月 27 日起)中的默认网格是 XY 网格。所以你有两个选择:

  1. 根据新的 XY 网格更改您的标记(查看 http://foundation.zurb.com/sites/docs/xy-grid.html)
  2. 更改框架以使用 Float Grid,现在这取决于您首先如何下载框架;如果你使用预编译包,你应该去http://foundation.zurb.com/sites/download.html/#customizeFoundation自定义(基本上只需选择 Float Grid 并下载一个新包);如果您使用的是 SASS 版本,请转到 app.scss 删除显示 @include foundation-grid; 的行的注释,并注释带有 @include 的行foundation-xy-grid-classes;,然后重建框架。

希望这对您有所帮助。

关于HTML/CSS : Foundation stylesheet wont link,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45070758/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com