Design the text using CSS


 Use the text-transform property to change the case of the text:

The text-transform property in CSS is used to change the appearance of text. It's a convenient way to make sure text on a webpage appears consistently, without having to change the text content of the actual HTML elements.

The syntax for this is:

                                                text-transform: value;

The following table shows how the different text-transform values change the example text "Transform me".

Value                                                                                                        Result

lowercase                                                                                            "transform me"

uppercase                                                                                             "TRANSFORM ME"

capitalize                                                                                                "Transform Me"

initial                                                                                                      "use default value"

inherit                                                                                                   "use the text-transform value of                                                                                                                                         the parent element"

none                                                                                                       default: original text

Set the font size for multiple heading elements:

The font-size property is used to specify how large the text is in a given element. This rule can be used for multiple elements to create visual consistency of text on a page.

The syntax for this is:

                         font-size: value;

Set the font weight for multiple heading elements:

The font-weight property sets how thick or thin characters are in a section of text.

The syntax for this is:

                                                font-weight: value;

A real-time example of these three CSS styles is:

                    h1 {

    text-transform: uppercase;
    font-size: 68px;
font-weight: 800;
  }
Note that the code should be placed in the style element of the HTML page.

No comments:

Post a Comment