阅读(2.3k) 书签赞(0) 我要纠错

Pure.CSS教程

2018-12-21 16:41 更新

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>

以上内容是否对您有帮助：

Pure.CSS概述 →

写笔记

我要补充