What are the default sizes given to <body> tag in Bootstrap framework ?
Last Updated :
03 Mar, 2022
In this article, we are going to find out about the default sizes given by the bootstrap framework to the <body> tag.
Bootstrap is an awesome CSS and javascript framework to create beautiful and responsive websites which are fast and easy to make. It’s very easy to learn and provides a lot of pre-built components which can be directly added to your HTML and make your website functional at an ease. By default Bootstrap updates the <body> tag to provide better page-wide defaults.
Bootstrap applies the following properties on the body tag:
font-size: 1rem;
margin: 0;
Note: Bootstrap assumes the default font-size “16px” applied by the browser to be equal to 1rem.
Properties applied by bootstrap on body tag
value of font-size
So, these are the default sizes applied by bootstrap on the <body> tag in HTML. Let us look at examples to see these default sizes in effect:
Example 1: Understanding the effect of the default margin value
HTML
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet"
href=
</head>
<body>
<h1>Hello, world!</h1>
<script src=
</script>
</body>
</html>
|
Output:
Notice that in the first pic, there is no space between the boundaries and the <h1> tag. This is because bootstrap has set margin to 0 which overrides the default margin applied by the browsers.
Effect of the font-size value: The font size equal to 1 rem means the default font size for a <p> tag or any normal text is equal to 1rem. And 1rem translates (be default) to 16px. Hence the default font size is 16px.
Example 2: Understanding the effect of the font-size value
HTML
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet"
href=
</head>
<body>
<p>Hello, world!</p>
<a href="#">GeeksForGeeks</a>
<span>
Right now reading about default sizes
applied by the bootstrap
</span>
On the body tag
<script src=
</script>
</body>
</html>
|
Output: As you can see in all the text whether in an a, p or span or without any tag at all, the size is equal to 1rem or 16px (by default).
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...