Text Sampler

Property Description Values
Text–Indent Defines the indentation of the first line of content
  • length
  • percentage
  • inherit

Example of text which displays indents the first line using a length values such as 15px is displayed like text–indent:25px;

Example of text which displays indents the first line using a percentage value such as 15% is displayed like text–indent:15%;

Letter–Spacing Defines the amount of whitespace to be inserted between the character boxes of text.
  • length
  • normal
  • inherit
Example of Text which displays using letter– Spacingatsize 15px, the code is
letter–spacing:15px;
Example of Text which displays using letter – Spacingatsize 15px, the code is letter–spacing:normal;
Word–Spacing Defines the amount of whitespace to be inserted between words
  • length
  • normal
  • inherit

Example of text which displays at word–spacing at 2em – the code is
word–spacing:2em;

Example of text which displays at word–spacing normal – the code is
word–spacing:normal;

Text–Decoration
Allows certain text effects such as underline
  • none
  • underline
  • overline
  • line–through
  • blink
  • inherit

Example of Text which displays at text–decoration none – the code is
text–decoration:none;

Example of Text which displays at text–decoration underline – the code is
text–decoration:underline;

Example of Text which displays at text–decoration overline – the code is
text–decoration:overline;

Example of Text which displays at text–decoration line–through – the code is
text–decoration:line–through;

Example of Text which displays at text–decoration blink – the code is
text–decoration:blink;
Text–Align
Property sets the horizontal alignment of text
  • left
  • center
  • right
  • justify
  • inherit

Example of text which displays the text–align property of left – the code is
text–align:left;

Example of text which displays the text–align property of center – the code is
text–align:center;

Example of text which displays the text–align property of right – the code is
text–align:right;

Example of text which displays the text–align property of justify – the code is
text–align:justify;

Line–Height
Defines the minimum distance between baselines within that element
  • length
  • percentage
  • number
  • normal
  • inherit

Example of text which displays the line–hight using length – the code is
line–height:25px;

Example of text which displays the line–hight using percentage – the code is
line–height:15%;

Example of text which displays the line–hight using length – the code is
line–height:1.5;

Text–Transform Property changes the case of letters in an element
  • uppercase
  • lowercase
  • capitalize
  • none
  • inherit
Example of text which displays at text–transform of uppercase – the code is
text–transform:uppercase;
Example of text which displays at text–transform of lowercase – the code is
text–transform:lowercase;
Example of text which displays at text–transform of Capitalize – the code is
text–transform:capitalize;
Vertical–Align
Defines the vertical alignment of an inline element’s baseline
  • baseline
  • sub
  • super
  • top
  • text–top
  • middle
  • bottom
  • text–bottom
  • percentage
  • length
  • inherit

Example of text which di splays at vertical–align of baseline – the code is
vertical–align:baseline;

Example of text which displays at the <sup> tag which raises the register mark above the baseline of text Vioxx® – the code is
<sup>&reg;</sup>