1) What is W3.CSS?
W3.CSS stands for Cascading Style Sheet. It is developed by w3schools.com. It is used to create faster, beautiful and responsive websites.
2) What are the features of W3.CSS?
W3.CSS features are:
It is in-built responsive designing.
It provides standard CSS.
It is inspired by Google Material Design
It is free to use.
3) What are the techniques to use W3.CSS?
There are two techniques to use W3.CSS.
- Local Installation: We can download the W3.CSS file on our local machine and include it in to HTML.
- CDN Based Version: We can include the W3.CSS file into our HTML code directly from the CDN (Content Delivery Network).
4) What are the classes of W3.CSS container?
There are various classes of w3.CSS container:
W3-container
W3-red
W3-border
W3-teal etc.
5) What are the classes to create a responsive design?
There are following classes to create responsive designs that are listed table:
| Class Name |
Description |
| w3-half |
It is used to sets the container to 1/2nd of the window. |
| w3-third |
It is used to sets the container to 1/3rd of the window. |
| w3-quarter |
It is used to set the container to 1/4th of the window. |
| w3-col |
It specifies a column in a 12 column grid. |
| W3-row |
It specifies padding-less container to be used for responsive classes. |
6) How can we use subclasses in W3.CSS?
We can use subclasses by using following step:
<div class="w3-row">
<div class="w3-col s2 m4 l3">
<p>This text will use 2 columns on a small screen, 4 on a medium screen, and 3 on a large screen.</p>
</div>
</div>
7) What are the W3.CSS form classes?
The following W3.CSS form classes are given below:
| Class Name |
Descriptions |
| w3-group |
It represents a bordered container that is used to group a label and input. |
| w3-input |
It is used to create awesome input control. |
| w3-label |
It is used to create awesome label. |
| w3-checkbox w3-checkmark |
It is used to create awesome checkbox and redio button. |
8) How can we create W3.CSS buttons?
We can create W3.CSS buttons by using given step:
<body class="w3-container">
<button class="w3-btn">Click Me</button>
<a class="w3-btn">Link</a>
<a class="w3-btn-floating-large">+</a>
<a class="w3-btn-floating">+</a>
</body>
9) What is model dialog in W3.CSS?
In W3.CSS model dialog is used to display a customizable model dialog box instead of the JavaScript alert. It uses w3-row and W3-col style classes.
10) What are the classes of W3.CSS cards?
There are various classes of W3.CSS card:
w3-card
w3-card-2
w3-card-4
w3-card-8
w3-card-12
11) What are the various table classes in W3.CSS?
There are various table classes in W3.CSS:
| Class Name |
Description |
| w3-table |
It represents a basic table without any border. |
| w3-striped |
It is used to display a stripped table. |
| w3-bordered |
It is used to draw a table with a border across rows. |
| w3-card |
It is used to draws a table as a card. |
12) What are the uses of W3.CSS image classes?
W3.CSS image classes are used to display the different type of style. The following image classes are given below:
| Image classes |
Description |
| w3-image |
It is used to represent a basic style image without any border. |
| w3-circle |
It is used to create circle image. |
| w3-title |
It is used to display the text over an image. |
| w3-card |
It is used to create an image as a card. |
13) What are the W3.CSS icon libraries?
W3.CSS icon libraries are:
Font Awesome Icons
Google Material Icons
Bootstrap Icons
14) How can we create navigation in W3.CSS?
We can create navigation in W3.CSS by using
nav classes.
Example
<body class="w3-container">
<nav class="w3-topnav w3-red">
<a href="#">Home</a>
<a href="#">Overview</a>
</nav>
</body>