Pure CSS Installation

Pure CSS Installation

There is two easiest methods to install the Pure CSS framework inside the web project.

  • Install Locally
  • Using Pure CSS CDN Link

Install Locally

You can download the latest version of pure CSS from: https://purecss.io/start/ and include the CSS library inside the <head> section of HTML code using <link>.

Example

Let us include the downloaded pure CSS library link into HTML code.

Source Code

General Syntax

Try it now

Source Code

Try it now

If you run the above source code then the output look like:

First Column

Second Column

Third Column

Using CDN Link

You can add pure css library to the HTML source code from the <a href="https://purecss.io/customize/">content delivery network(CDN)<a>.

You can also add Pure CSs library link by free unpkg CDN. Just place the following <link> element inside the <head> section of the HTML source code before the project's stylesheets.

<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/pure-min.css" >

Example: Adding CDN Link In the HTML Code

Let use use the official CDN link inside the HTML source code.

General Syntax

Try it now

Source Code

Try it now

If you run the above source code then the output look like:

First Column

Second Column

Third Column

Add the Viewport Meta Element

Since pure CSS creates a responsive website means adjusting itself according to the device viewport, hence you have to place the meta elements inside the <head> section of the HTML source code. It controls the width and scale of the viewport on mobile

<meta name="viewport" content="width=device-width, initial-scale=1">