CSS: Text, Fonts, and Tables
(Page 1 of 6 )
We last left off discussing text in CSS. In this article we will finish this discussion, and cover how to manipulate fonts as well. And if time permits, we will also go over tables in CSS. It's a lot of ground to cover, so let's jump right in.
Can I Get Directions?
You can manipulate an element's text direction using direction. Here is an example:
<html>
<head>
<style type="text/css">
div.rightoleft
{
direction: rtl
}
div.lefttoright
{
direction: ltr
}
</style>
</head>
<body>
<div class="rightoleft">This text runs right to left.</div>
<div class="lefttoright">This text runs left to right.</div>
</body>
</html>
Increasing the Space Between Your Ears
It is possible to increase the amount of white space between your words, using word-spacing:
<html>
<head>
<style type="text/css">
p
{
word-spacing: 20px
}
h1{word-spacing: 50px}
h2{word-spacing: 40px}
h3{word-spacing: 30px}
h4{word-spacing: 20px}
h5{word-spacing: 10px}
h6{word-spacing: 5px}
</style>
</head>
<body>
<p>
My feet sure do stink
</p>
<h1>Hello fools</h1>
<h2>Take me to your leader</h2>
<h3>Actually, take me to your Burger King</h3>
<h4>My Intergalactic Zagats says its the best in this quadrant</h4>
<h5>I hear the North American cockroach is very delectable</h5>
<h6>Hey you feeling okay? You don't look so well...</h6>
</body>
</html>
Next: Word Wrapping >>
More Style Sheets Articles
More By James Payne
