Pure.CSS教程
Pure.CSS教程
Pure是YAHOO开发的级联样式表(CSS)。 它有助于创建更快,更美观,更灵敏的网站。 它是非常空间精明,是非常小的,相当于4 KB。
受众
本教程面向希望学习Pure的基础知识以及如何使用它来创建更快,更美观,更灵敏的网站的专业人员。 本教程解释了Pure的所有基本概念。
先决条件
在继续学习本教程之前,您应该对HTML,CSS,JavaScript,文档对象模型(DOM)和任何文本编辑器有基本的了解。此外,如果您了解基于Web的应用程序是如何工作的,这将对您(学习本教程)有所帮助。
在线执行pure
对于本教程中给出的大多数示例,您将找到一个Try-it选项。 那么使用此选项立即执行您的Pure程序,并享受您的学习吧。<html>
<head>
<title>The PURE.CSS Example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://yui.yahooapis.com/pure/0.6.0/pure-min.css">
<style>
.grids-example {
background: rgb(250, 250, 250);
margin: 2em auto;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
font-family: Consolas, 'Liberation Mono', Courier, monospace;
text-align: center;
}
</style>
</head>
<body>
<div class="grids-example">
<div class="pure-g">
<div class="pure-u-1-3"><p>First Column</p></div>
<div class="pure-u-1-3"><p>Second Column</p></div>
<div class="pure-u-1-3"><p>Third Column</p></div>
</div>
</div>
</body>
</html>