Text
In CSS, you can style text in various ways using properties such as font-family
, font-size
, font-weight
, font-style
, color
, text-align
, and more. Here are some examples of how you can style text:
Color and Alignment:
- Text Color: Use the
color
property to set the color of the text.
- Text Alignment: Adjust the
text-align
property to control the alignment of text within an element.
Text Decoration:
- Underline and Overline: Use
text-decoration
to add or remove underlines and overlines.
- Line Through: Apply a line through the text using
text-decoration
.
Example1: This example illustrates the use of text color property:
output:
Example 2: This example illustrates the use of the text- align property
output:
Example 3: This example illustrates the use of the text decoration property.
output:
Font
In CSS, the font
property is a shorthand property that allows you to set various font-related properties in a single declaration. The font
property can include values for font-style
, font-variant
, font-weight
, font-size
, line-height
, and font-family
. Here’s how you can use the font
property:
Basic Usage:
In this example:
normal
is forfont-style
.normal
is forfont-variant
.normal
is forfont-weight
.16px
is forfont-size
.1.5
is forline-height
.'Arial', sans-serif
is forfont-family
.
Individual Font Properties:
You can also set each font property individually:
In this example:
font-family
sets the font family.font-size
sets the font size.font-weight
sets the font weight.font-style
sets the font style.line-height
sets the line height.
Using Google Fonts:
You can include Google Fonts or other web fonts by adding a link
tag in the HTML file and then using the specified font in your CSS.
Example 1: This example illustrates the font style property:
output: