W3.CSS Introduction

Last Updated : 02 Mar, 2021

What is W3.CSS?

W3.CSS is a modern framework with built-in responsiveness and easy to learn and use compared to other CSS frameworks.
It aims to speed up and simplify web development and support modern responsive devices like Mobile, Laptop, Tablet and Desktop.
W3.CSS was designed to be a high-quality alternative to Bootstrap.

How to use W3.CSS on a webpage?

W3.CSS is free for everyone to use. Anyone can use it by simply linking the style in their webpage. There are two ways to include W3.CSS on the website:

Include W3.CSS from this link as mentioned below:

HTML

<link rel="stylesheet"

href="https://www.w3schools.com/w3css/4/w3.css">

Download W3.CSS from here and use it.

Example:

HTML

<!DOCTYPE html> 
<html> 
  
<head> 
  
    <!-- Adding W3.CSS file through external link -->
    <link rel="stylesheet" href= 
        "https://www.w3schools.com/w3css/4/w3.css"> 
  
</head> 
  
<body> 
  
    <!-- w3-container is used to add 16px  
        padding to any HTML element.  -->
    <!-- w3-center is used to set the content  
        of the element to the center. -->
    <div class="w3-container w3-center"> 
        <!-- w3-text-green sets the text color  
            to green. -->
        <!-- w3-xxlarge sets font size to 32px -->
        <h2 class="w3-text-green w3-xxlarge"> 
            Welcome To GFG 
        </h2> 
    </div> 
  
    <div class="w3-container"> 
  
        <!-- w3-text-red sets the text  
            color to red. -->
        <p class="w3-text-red"> 
            GeeksforGeeks is a Computer Science  
            portal for geeks. It contains well  
            written, well thought and well  
            explained computer science and  
            programming articles, quizzes etc. 
        </p> 
    </div> 
</body> 
  
</html> 