HTML5 – CSS frameworks
A CSS framework is a pre-designed set of CSS styles that developers can use as a foundation for their web applications. CSS frameworks provide a consistent and standardized way to style web applications, and they can save developers time and effort by providing a common set of styles that can be easily modified to fit the needs of the application.
There are many CSS frameworks available, including popular ones like Bootstrap, Foundation, and Materialize. These frameworks provide a variety of features such as a grid system, responsive design, typography styles, form styles, and button styles, among others.
To use a CSS framework, you typically include the framework’s CSS file in the <head> of your HTML document, and then use the framework’s predefined class names to apply styles to your HTML elements.
Here is an example of how to use the Bootstrap CSS framework to create a responsive layout:
<!-- Include the Bootstrap CSS file -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/css/bootstrap.min.css">
<!-- Create the layout -->
<div class="container">
<div class="row">
<div class="col-sm-4">Column 1</div>
<div class="col-sm-4">Column 2</div>
<div class="col-sm-4">Column 3</div>
</div>
</div>
In this example, the container class is used to create a container element, the row class is used to create a row element, and the col-sm-4 class is used to create a column element with a width of 4 columns on small screens. The col-* classes are responsive and will adjust their width based on the screen size.