Con*_*sea 6 html css yui-pure-css
使用Pure网格,我的网站没有正确响应,所以我尝试将默认的响应式网格代码复制并粘贴到我的文件中,但仍然无法正常运行.
这是他们网站上列出的默认代码:
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-3"> ... </div>
<div class="pure-u-1 pure-u-md-1-3"> ... </div>
<div class="pure-u-1 pure-u-md-1-3"> ... </div>
</div>
我的完整代码可以在这里找到.W¯¯ 母鸡在浏览器中查看下面的代码,所述三组点的出现,就好像它们被堆叠在彼此的顶部,或者在100%列的宽度.从每个类列表中删除"pure-u-1"显示它们就好像这些点都非常小而且彼此叠加,字面上(不像块一样堆叠,因为你只能看到一组点).
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>B&W Vending</title>
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/pure-min.css">
</head>
<body>
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-3"> ... </div>
<div class="pure-u-1 pure-u-md-1-3"> ... </div>
<div class="pure-u-1 pure-u-md-1-3"> ... </div>
</div>
</body>
</html>
Con*_*sea 15
由于pure-css网站上的说明冲突,我有点困惑,我自己想出来了.一旦我包含以下样式表,它就有效了.
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/grids-responsive-min.css">
在一个pure-css网格页面上,它指出:
由于媒体查询无法覆盖,因此我们不会将网格系统作为pure.css的一部分.您必须将其作为单独的CSS文件提取.您可以通过在页面中添加以下标记来完成此操作.
稍后在页面中,它表明看似相反的指示:
网格是Pure CSS文件的一部分.但是,如果您只想要网格而不是其他模块,则可以单独将其下拉.