CSS Text

Next ❯CSS Font

Used to style the text appearance

  • turned_in_notText Related Properties
    • labelText Properties
      • text-align
      • text-decoration
      • text-indent
      • text-transform
    • labelExtra Properties
      • color
      • direction
      • line-height
      • letter-spacing
      • word-spacing
      • white-space

Checkout the text by using some tryouts
h1 {
  text-align:center;
  text-decoration:none;
  text-indent:10px;
  text-transform:none;
}
Textsubject
Textclose
<!DOCTYPE html>
<html>
<head>
<title>Full CSS Code</title>
<style>
h1 {
  text-align:center;
  text-decoration:none;
  text-indent:10px;
  text-transform:none;
  width:350px;
}
</style>
</head>
<body>
<h1>Checkout the text by using some tryouts</h1>
</body>
</html>
  • label_outlineTryout Others
    PropertiesValues
    text-align:
    text-decoration:
    text-indent:
    text-transform:

Checkout this text
h1 {
  color: red;
  direction: ltr;
  line-height: normal;
  letter-spacing: normal;
  word-spacing: normal;
  background:#dcfbdb;
}
Extra Propertiessubject
Extra Propertiesclose
<!DOCTYPE html>
<html>
<head>
<title>Full CSS Code</title>
<style>
h1 {
  color: red;
  direction: ltr;
  line-height: normal;
  letter-spacing: normal;
  word-spacing: normal;
  background:#dcfbdb;
}
</style>
</head>
<body>
<h1>Checkout this text</h1>
</body>
</html>
  • label_outlineTryout more
    PropertiesValues
    color:
    direction:
    line-height:
    letter-spacing:
    word-spacing:
    • normal values above are browser default


Checkout how whitespace inside this text handled
white-space:

In above text we put some whitespace in between

h1 {
  white-space:normal; /*Default*/
  width:300px;
  background:lightgreen;
  overflow-x:auto;
}
white-spacesubject
white-spaceclose
<!DOCTYPE html>
<html>
<head>
<title>Full CSS Code</title>
<style>
h1 {
  white-space:normal; /*Default*/
  width:300px;
  background:lightgreen;
  margin:auto;
  overflow-x:auto;
}
</style>
</head>
<body>
<h1>Checkout  how whitespace    inside this    text handled</h1>
</body>
</html>

  • CSS Font
❮ Prev Width & Height
Next ❯CSS Font
TryOut Examples"Learn to Explore..!"

TryOut Editor

receipt
❯