To make your font bold using CSS, you can use the font-weight
property. Here’s how you can do it:
1. Using font-weight
Property
The font-weight
property in CSS allows you to set the thickness of the text. To make the font bold, you can set it to bold
or use numeric values.
Example:
/* Make text bold using 'font-weight' */
.bold-text {
font-weight: bold;
}
2. Using Numeric Values
The font-weight
property can also accept numeric values, where 400
is the normal weight and 700
is typically the bold weight.
Example:
/* Make text bold using numeric value */
.bold-text {
font-weight: 700;
}
3. HTML Example
You can apply the CSS class to any HTML element like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
/* Make text bold */
.bold-text {
font-weight: bold;
}
</style>
<title>Bold Text Example</title>
</head>
<body>
<p>This is a <span class="bold-text">bold text</span> example.</p>
</body>
</html>
4. Using Inline CSS
You can also apply bold styling directly within the HTML element using the style
attribute.
<p style="font-weight: bold;">This is bold text using inline CSS.</p>
Summary:
font-weight: bold;
: This will make the text bold.font-weight: 700;
: You can also use numeric values (700 for bold).- Apply it to HTML elements using a class or inline CSS.