W3.CSS - Configuración del entorno

¿Cómo utilizar W3.CSS?

Hay dos formas de utilizar W3.CSS:

Local Installation - Puede descargar el archivo W3.CSS en su máquina local e incluirlo en su código HTML.
CDN Based Version - Puede incluir el archivo W3.CSS en su código HTML directamente desde Content Delivery Network (CDN).

Instalación local

Ir https://www.w3schools.com/w3css/w3css_downloads.asp para descargar la última versión disponible.
Luego, coloque el archivo w3.css descargado en un directorio de su sitio web, por ejemplo, / css.

Ejemplo

Ahora puede incluir el archivo css en su archivo HTML de la siguiente manera:

<html>
   <head>
      <title>The W3.CSS Example</title>
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      <link rel = "stylesheet" href = "css/w3.css">
   </head>
   
   <body>
      <header class = "w3-container w3-teal">
         <h1>Hello World!</h1>
      </header>
   </body>
</html>

Producirá el siguiente resultado:

Versión basada en CDN

Puede incluir el archivo W3.CSS en su código HTML directamente desde Content Delivery Network (CDN). W3Schools.com proporciona contenido para la última versión.

Note - Estamos utilizando la versión CDN de W3Schools.com de la biblioteca a lo largo de este tutorial.

Ejemplo

Ahora reescribamos el ejemplo anterior usando la biblioteca jQuery de W3Schools.com CDN.

<html>
   <head>
      <title>The W3.CSS Example</title>
      <meta name = "viewport" content = "width =  device-width, initial-scale = 1">
      <link rel = "stylesheet" href = "https://www.w3schools.com/lib/w3.css">
   </head>
   
   <body>
      <header class = "w3-container w3-teal">
         <h1>Hello World!</h1>
      </header>
   </body>
</html>

Producirá el siguiente resultado: