Pure CSS is a popular framework & an open-source tool, developed by Yahoo, for creating responsive websites & web applications by making use of the responsive CSS modules, that help to develop a better user experience with high efficiency. It can be used as an alternative to Bootstrap.
The Base module in Pure CSS contains the style properties that are commonly used in most websites. It is an HTML5-ready alternative for the CSS properties, leveraging the Normalize.css. All the Pure CSS modules are built on top of the Normalize.css, which is the functional layer in order to maintain cross-browser consistency.
- Normalize.css
- Pure CSS Hiding Elements
- Pure CSS Responsive Images
Example:
HTML
<!DOCTYPE html> <html lang="en">
<head>
<title>PureCSS</title>
<meta charset="utf-8">
<meta name="viewport" content=
"width=device-width, initial-scale=1">
<link rel="stylesheet" href=
integrity=
"sha384-LTIDeidl25h2dPxrB2Ekgc9c7sEC3CWGM6HeFmuDNUjX76Ert4Z4IY714dhZHPLd" crossorigin="anonymous">
</head>
<body>
<center>
<div style="width: 500px;
background-color: yellow;">
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h2>Responsive Image</h2>
<img class="pure-img" src=
style="border-radius: 50px;" />
</div>
</center>
</body>
</html>
|
Output:
Pure CSS Base