CSS Text
This text is styled with some of the text formatting
properties. The heading uses the text-align, text-
transform, and color properties. The paragraph is
indented, aligned, and the space between
characters is specified.
text-align Property
The text-align property specifies the horizontal
alignment of text in an element.
Value Description
left Aligns the text to the left
right Aligns the text to the right
center Centers the text
justify Stretches the lines so that each
line has equal width (like in
newspapers and magazines)
text-decoration Property
The text-decoration property specifies the decoration
added to text.
Value Description
none Defines a normal text. This is
default
underline Defines a line below the text
overline Defines a line above the text
line-through Defines a line through the text
blink Defines a blinking text.
text-indent Property
The text-indent property specifies the indentation of
the first line in a text-block.
Value Description
length Defines a fixed indentation
in px, pt, cm, em, etc.
% Defines the indentation in
% of the width of the parent
element
text-justify Property
The text-justify property specifies the
justification method to use when text-
align is set to "justify". This property
specifies how justified text should be
aligned and spaced.
Syntax
text-justify: auto|inter-word|inter-ideograph |
intercluster |distribute |kashida|trim;
Value Description
auto The browser determines the justification algorithm
inter-word Increases/Decreases the space between words
inter-ideograph Justifies content with ideographic text
inter-cluster Only content that does not contain any inter-word
spacing (such as Asian languages) is justified
distribute Like the newspaper value, except that in East Asian
languages (such as Thai) the last line is not justified
kashida Justifies content by elongating characters
trim
none The justification is disabled
text-outline Property
The text-outline property specifies a text outline.
p.test
{
text-outline: 2px 2px #ff0000;
}
syntax:
text-outline: thickness blur color;
The text-outline property is not supported in any of the
major browsers.
Value Description
thickness Required. The thickness of the outline
blur Optional. The blur radius of the outline
color Required. The color of the outline.
text-overflow Property
The text-overflow property specifies
what should happen when text
overflows the containing element.
Syntax
text-overflow: clip|ellipsis|string;
Value Description
clip Clips the text
ellipsis Render an ellipsis ("...") to represent clipped text
string Render the given string to represent clipped text
text-shadow Property
The text-shadow property applies shadow to
text.
Syntax
text-shadow: h-shadow v-shadow blur color;
Value Description
h-shadow Required. The position of the horizontal shadow.
Negative values are allowed
v-shadow Required. The position of the vertical shadow.
Negative values are allowed
blur Optional. The blur distance
color Optional. The color of the shadow.
text-transform Property
The text-transform property controls
the capitalization of text.
Value Description
none No capitalization. The text renders as it is.
This is default
capitalize Transforms the first character of each word
to uppercase
uppercase Transforms all characters to uppercase
lowercase Transforms all characters to lowercase
text-wrap Property
The text-wrap property specifies line
breaking rules for text.
text-wrap: normal|none|unrestricted|
suppress;
Value Description
normal Lines may break only at allowed break points
none Lines may not break. Text that does not fit in
the element, overflows it
unrestricted Lines may break between any two characters
Text Color
The color property is used to set the color of
the text.
With CSS, a color is most often specified by:
• a HEX value - like "#ff0000"
• an RGB value - like "rgb(255,0,0)"
• a color name - like "red"
Value Description
color Specifies the text color.