HTML/CSS/Text/text indent

Материал из Web эксперт
Перейти к: навигация, поиск

Negative text indent value: -60px

   <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"> p.hanging {

text-indent: -5em;
margin-left: 5em;

}

  1. content p.hanging {
text-indent: -60px;
margin: 0 0 0 60px;
padding: 0;

}

  1. content h3 {
text-indent: -60px;
margin: 0 0 0 60px;
padding: 0;

} </style> </head> <body>

Once more time with feeling

handing;

</body> </html>

</source>
   
  


Set text-indent to 2.5em

   <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"> p {

text-indent: 2.5em;
margin: 0 0 0.5em 0;
padding: 0;

} </style> </head> <body>

The heading for this page

This is a text.

This is a text.

</body> </html>

</source>
   
  


Set text indent to 35px

   <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>Set background image and repeat separately</title> <style type="text/css"> span.initcap {

display: none;

} p {

line-height: 1em;
background: red;
text-indent: 35px;
padding-top: 45px;

} </style> </head> <body>

Online. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test. This is a test.

</body> </html>

</source>
   
  


Set text indent to 37%

   <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>Set text indent to 37%</title> <style type="text/css"> p {

text-indent: 37%;
line-height: 1em;

} p span.initcap {

font-size: 6em;
line-height: 0.6em;
font-weight: bold;

} </style> </head> <body>

Online. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test. This is test.

</body> </html>

</source>
   
  


Set text indent to -5em

   <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"> p.hanging {

text-indent: -5em;
margin-left: 5em;

}

  1. content p.hanging {
text-indent: -60px;
margin: 0 0 0 60px;
padding: 0;

}

  1. content h3 {
text-indent: -60px;
margin: 0 0 0 60px;
padding: 0;

} </style> </head> <body>

Once more time with feeling

handing;

</body> </html>

</source>
   
  


uses a negative value for text-indent and a positive value for padding-left.

   <source lang="html4strict">

<!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"> <head>

   <meta http-equiv="content-type" content="text/html; charset=utf-8" />
   <title></title>

<style type="text/css" media="Screen">

  • .myStyle {
 text-indent: -50px;
 padding-left: 50px;

} </style> </head> <body>

asdf

</body> </html>

</source>