-
Pure.CSS教程

Pure.CSS教程

Pure是YAHOO开发的级联样式表（CSS）。它有助于创建更快，美观和响应更快的网站。这是非常空间精明，是非常小的尺寸相当于4 KB。本教程解释了Pure的所有基本概念

适合人员

本教程适用于希望了解Pure基础知识的专业人士，以及如何使用它来创建更快，美观和响应更快的网站。

学习提醒

在进行本教程之前，您应该对HTML，CSS，JavaScript，文档对象模型（DOM）和任何文本编辑器有一个基本的了解。另外，如果您了解基于Web的应用程序如何工作，这将有所帮助。

执行纯在线

对于本教程中给出的大多数示例，您将找到一个Try-it选项。使用此选项即时执行您的Pure程序，并享受您的学习。

请尝试以下示例，使用以下示例代码框右上角的Try-it选项 -

<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>

© 2023 mianshi8.net MIT license