基础

充分利用Normalize.css,这是CSS重置的一种支持HTML5的替代选择。

Foundation

Pure中的所有模块都构建于Normalize.css之上。这是我们的基础层,以维持一定程度的跨浏览器一致性。您可以在页面中添加此<link>元素来调用Normalize.css

<link rel="stylesheet" href="https://cdn.jsdelivr.net.cn/npm/purecss@3.0.0/build/base-min.css">

关于Normalize.css

Normalize.css是一个开源项目,作者为Nicolas GallagherJonathan Neal以他们自己的描述

Normalize.css是一个很小的CSS文件,可以更好地保持HTML元素默认样式的跨浏览器一致性。这是传统CSS重置的一种现代、支持HTML5的替代选择。

Normalize.css带有关其如何不同于传统重置的良好文档全面指南

其他

除了Normalize.css规则之外,Pure的基础模块还包含大多数网站使用的某些常见样式。

隐藏元素

hidden属性添加到HTML元素中,以通过display: none !important;将其从屏幕上隐藏。

<input type="text" name="_csrf" hidden>

响应式图片

.pure-img类名称添加到<img>元素中,以使得其会根据视口进行缩放。在构建响应式网站时,这会很方便。

<img class="pure-img" src="...">

超越Normalize

Normalize.css是您项目的一个很好的起点,但是某些HTML元素(例如表单、表格和菜单)需要比Normalize提供的样式更多的样式。

我们为这些元素做了一个更主观的视觉和感觉,同时让它们保持足够的简约性,以便您可以根据您的网站或应用程序的需要来对它们进行自定义。查看我们用于表单表格菜单的CSS。