Forum | Gli ultimi tutorial di sviluppo web
 

Pure.CSS lezione


Pure è un Cascading Style Sheet (CSS) sviluppato da YAHOO . Essa aiuta a creare più velocemente, belle, e reattivi siti web. E 'molto esperto di spazio ed è molto piccolo in termini di dimensioni paragonabili a 4 KB.


Pubblico

Questo tutorial è pensato per i professionisti che desiderano imparare le basi di pura e come usarlo per creare siti web più veloci, belle, e reattivi. Questo tutorial spiega tutti i concetti fondamentali di Pure.


Prerequisiti

Prima di procedere con questo tutorial, si dovrebbe avere una conoscenza di base di HTML, CSS, JavaScript, Document Object Model (DOM), e qualsiasi editor di testo. Inoltre, vi aiuterà se si sa come funzionano le applicazioni web-based.


Esegui Pure in linea

Per la maggior parte degli esempi forniti in questo tutorial, si trova un Try-it opzione. Utilizzare questa opzione per eseguire i programmi Pure sul posto e godetevi il vostro apprendimento.

Provate il seguente esempio utilizzando l'opzione Try-it disponibile nell'angolo in alto a destra della casella seguente codice di esempio -

<html>
   <head>
      <title>The PURE.CSS Example</title>
	  <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="http://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>