CSS Sizing, Button, Float and Clear
We can resize the object in different ways. For Example, we use pixels (px) to resize the objects. Rem is commonly used to resize the object.
For Example:
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<title>Document</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
CSS:
h1 {
font-size: 4rem;
}
1rem is equal to 16px
We can use line-height to give space on our website. If we want to change image size then we use the width property to change the size of images.
CSS Float:
CSS float is very useful to wrap the website. If we want to wrap the text into the right side first we select the class or id and give it a property called float : right; so that it aligns the object to the right side.
Example of float property, the link is given below:
https://www.w3schools.com/cssref/tryit.asp?filename=trycss_float
CSS Clear:
The clear property controls the flow next to floated elements.
Example of clear property, the link is given below:
https://www.w3schools.com/cssref/tryit.asp?filename=trycss_class-clear
CSS Button:
Check the button property, the link is given below:
https://www.w3schools.com/css/tryit.asp?filename=trycss_buttons_basic
If you want to generate a button on the website, the link is given below: https://css3buttongenerator.com/
You can style your button whatever you want and then copy the CSS code and paste it into your css file.
Comments
Post a Comment