How To Set Font Size For P Element With Pixels Using CSS

admin_img Posted By Bajarangi soft , Posted On 02-11-2020

In CSS The font-size property sets the size of the text and setting the text size with pixels gives you full control over the text size. So today we discuss how to set font size using css.

How To Set Font Size For P Element With Pixels Using CSS

Step 1:Create index.html file and implement as below code in it.

<h2>This is heading 2</h2>
<p class="p1">am p element paragraph.</p>
<p class="p2">am another p element paragraph.</p>

Step 2:Implement CSS code as below to control font size.

<style>
    body {
        background: #2e9ad0;
    }

    h2 {
        font-size: 30px;
    }

    .p1 {
        font-size: 14px;
    }
    .p2 {
        font-size: 10px;
    }
</style>

Complete Code For Setting Font Size For P Element With Pixels Using CSS.

<!DOCTYPE html>
<html>
<head>
    <title>How To Set Font Size For P Element With Pixels Using CSS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<style>
    body {
        background: #2e9ad0;
    }

    h2 {
        font-size: 30px;
    }

    .p1 {
        font-size: 14px;
    }
    .p2 {
        font-size: 10px;
    }
</style>
<body>
<br/><br/>
<div class="container">
    <br><br><br>
    <div class="text-center">
        <h1 id="color" style="color: white;">Set Font Size For P Element With Pixels Using CSS</h1>
    </div>
    <br>
    <div class="well">
        <h2>This is heading 2</h2>
        <p class="p1">am p element paragraph.</p>
        <p class="p2">am another p element paragraph.</p>
    </div>
    <br>
</div>
</body>
</html>

Related Post