close[x]


CSS

CSS-Home CSS-Environment CSS-Basic syntax CSS-Selector CSS-How To Add CSS CSS-Comment CSS-Color CSS-Background CSS-Font CSS-Text CSS-Boarder CSS-Margin CSS-Padding CSS-Height/Width CSS-Link CSS-Table CSS-Visibility CSS-Scrollable CSS-Float/Clear CSS-Line CSS-Align CSS-Dimension CSS-Event CSS-Pusedo class CSS-Position CSS-Transparency CSS-Dropdown CSS-Form CSS-List/Counter CSS-Website layout CSS-Text effect CSS-Image effect CSS-Button effect CSS-page number CSS-Box CSS-@media CSS-Multi device CSS-Multi device 1 CSS-Multi device 2



learncodehere.com




CSS - Text

CSS Text property is used to control the look of texts formatting in an HTML element.

CSS Text property makes you to change the text-align, text-color, text-transform , text-shadow and more

You can set following Text properties of an element −

  • text-color : This property is used to set the color of a text.
  • text-align : This property is used to align the text of a document.
  • text-decoration : This property is used underline, overline, and strikethrough text.
  • text-transform : This property is used to capitalize text or convert text to uppercase or lowercase letters.
  • text-shadow : This property is used to set the text shadow around a text.
  • text-indent : This property is used to specify the indentation of the first line of a text.
  • letter-spacing : This property is used to specify the space between the characters in a text.



  • Example : CSS - Text

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    p {
    color:red;
    text-align: right;
    text-decoration: underline;
    text-transform: uppercase;
    text-shadow: 2px 2px red;
    letter-spacing:5px;
    text-indent:3cm;
    }
    h3 {
    color:green;
    text-align: left;
    text-decoration: overline;
    text-transform: lowercase;
    text-shadow: 2px 2px;
    letter-spacing:0px;
    text-indent:1cm;
    }
    h4 {
    color:blue;
    text-align: center;
    text-decoration: line-through;
    text-transform: capitalize;
    text-shadow: 2px 2px 5px red;
    letter-spacing:20px;
    }
    </style>
    </head>
    <body>
    <p>code always.</p>
    <h3>code always to become best programmer.</h3>
    <h4>code now.</h4>
    </body>
    </html>

    When the above code is compiled , it produces the following result.

    Result

    Code Always.

    Code Always To Become Best Programmer.

    code now.

    You can set CSS Text properties inline, internal and external way of using CSS in your HTML page.