HTML/CSS/CSS Attributes and Javascript Style Properties/text indent
Содержание
text indent: -0.75em
<source lang="html4strict">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> ul {
width: 30%; padding: 0 0 0.75em 0; margin: 0; list-style: none;
} li {
text-indent: -0.75em; margin: 0.33em 0.5em 0.5em 1.5em;
} </style> </head> <body>
Table of Contents
- D
- P
- B
- A?
- S
</body> </html>
</source>
text-indent: 25%
<source lang="html4strict">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html>
<head> <title></title> <style type="text/css"> p { text-indent: 25%; width: 200px; } </style> </head>
<body>
This is a test. This is a test. This is a test. This is a test.
</body> </html>
</source>
text-indent: 25px;
<source lang="html4strict">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html>
<head> <title></title> <style type="text/css"> p { text-indent: 25px; width: 200px; } </style> </head> <body>
This is a test. This is a test. This is a test. This is a test.
</body>
</html>
</source>
text-indent: -25px (positive value)
<source lang="html4strict">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html>
<head> <title></title> <style type="text/css"> p { text-indent: -25px; width: 200px; } </style> </head> <body>
This is a test. This is a test. This is a test. This is a test.
</body>
</html>
</source>
text-indent: 3em
<source lang="html4strict">
<?xml version="1.0" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head>
<title>CSS Example</title> <style rel="stylesheet" type="text/css">
body {
color: #000000; background-color: #ffffff; font-family: arial, verdana, sans-serif; font-size: 12px;
} .indent {
text-indent: 3em;
} </style> </head> <body>
text-indent
aligned with the left-hand side of the browser window.
The content of this paragraph should be indented by 3 em.
</body> </html>
</source>
text-indent: -5%
<source lang="html4strict">
<html> <head> <title>Percentages Demo</title> <style type="text/css"> p {text-indent: -5%;
margin-left: 25%; margin-right: 15%; font-size: 150%;
</style> </head> <body>
This paragraph"s font and margins have been set with percentages. The indent was set with a negative percentage.
</body> </html>
</source>
"text-indent" Example
<source lang="html4strict">
<html> <body>
This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px. This is a sample paragraph with an indent of 100px.
</body> </html>