Change the text Case in CSS3

Change the text Case

We can use the text-transform property to change the text case in CSS3. For example, you may want all <h2> text to appear in all capital letters. The property controls how the browser displays the text regardless of how it was typed.

We can choose from four case values: capitalize, uppercase, lowercase, and none. use the capitalized value if you want the first character of each word to appear capitalized. use the non-valuse to leave the text as is. The non-value cycles are any case values the text may have inherited from the surrounding HTML tags.

Change the text case

Step 1: Click inside the tag declaration and type text-transform: and a space.

Step 2: Type a text case value ( capitalize, uppercase lower case, or none)

Result Output

<!DOCTYPE html>
<html>
    <Head>
        <Title>Coding thai</Title>
        <style>
            h1{
                text-align: center;
                text-transform: uppercase;
            }
        </style>
    </Head>
    <body>
        <h1>Types of Web Developer</h1> 
        <hr>
        <Section class="First">
            <p> A front end developer has one general responsibility: to ensure
              that website visitors can easily interact with the page.
                and Back-end developers are the experts who build and maintain 
              the mechanisms that process data and perform actions on websites.</p>
        </Section>
        <hr>
       <small> &copy;Copyright 2022 Codingthai</small>
    </body>
</html>

Follow us on Social Media For More

FacebookInstagramPinterest