HTML/CSS/Basic Tags/body

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

body background-repeat: no-repeat

 
<!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">
            html, body {
                height: 1000px;
            }
            body {
                background-image: url("backgroundImage.jpg");
                background-repeat: no-repeat;
            }
        </style>
    </head>
    <body>
    </body>
</html>



"body" defines where to display all text, graphics, and other web page content

    
  
<html>
<head>
<title>body element example</title>
</head>
  <body text="#0000ff" 
        bottommargin="150"
        topmargin="150">
        
  <p>
  Text is blue.
  </p>
  <hr>
  <br>
  
  </body>
</html>



Body margin

 

<!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">
body {
 margin-left: 15%;
 margin-right: 15%;
}

</style>
</head>
<body>
<h1>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</h1>
</body>
</html>



Set body background image and no repeat

 
<!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">
    <head>
        <title></title>
<style type="text/css">
body {
 background-image: url(bkgd.jpg);
 background-repeat: no-repeat; 
}
</style>
    </head>
    <body>
    </body>
</html>



Set <body> background image to no-repeat, and background-position to 75px 150px

 
<!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">
    <head>
        <title></title>
<style type="text/css">
body {
 background-image: url(bkgd.jpg);
 background-repeat: no-repeat;
 background-position: 75px 150px;        
}
</style>
    </head>
    <body>
    </body>
</html>



Set body font: 76% arial,sans-serif

 

<!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=ISO-8859-1" />
<title></title>
<style type="text/css">

body {
  font: 76% arial,sans-serif;
}
</style>
</head>
<body>
<div id="container">
  <div id="header">
    <h1>My Amazing Web Site </h1>
  </div>
  <div id="wrapper">
    <div id="content">
      <h2>Contact Form</h2>
      <form id="form1" name="form1" method="post" action="/">
    
      <label for="fmtitle" accesskey="i">T<span class="akey">i</span>tle</label>
      <select name="fmtitle" id="fmtitle">
      <option value="ms">Ms.</option>
      <option value="mrs">Mrs.</option>
      <option value="miss">Miss</option>
      <option value="mr">Mr.</option>
        </select>

        <label for="fmname" accesskey="n"><span class="akey">N</span>ame</label>
        <input type="text" name="fmname" id="fmname" />
    
        <label for="fmemail" accesskey="e"><span class="akey">E</span>mail</label>
        <input type="text"  name="fmemail" id="fmemail" />
    
        <label for="fmstate" accesskey="a">St<span class="akey">a</span>te/Province</label>
        <input type="text" name="fmstate" id="fmstate" />
    
        <label for="fmstate" accesskey="y">Countr<span class="akey">y</span></label>
        <input type="text" name="fmcountry" id="fmcountry" />
    
        <label for="fmmsg"><span class="akey">M</span>essage</label>
        <textarea name="fmmsg" accesskey="m" id="fmmsg" rows="5" cols="14"></textarea>
    
        <input type="submit" name="submit" value="send" class="submit" />
      </form>
    </div>
  </div>
  <div id="extra">
    <h2>quid pro quo</h2>
  </div>
  <div id="footer">
    <p>ask.</p>
  </div>
</div>
</body>
</html>



Set body margin to 10%

 
<!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=ISO-8859-1" />
<title></title>
<style type="text/css">
body {
margin: 10%;
}
</style>
</head>
<body>
<div id="box">
   <h2>
   header 2
   </h2>
     <p>This is a text.</p>
 </div>
</body>
</html>



Set font family for body

 
<html>
 <head>
  <title>Set font family for body</title>
  <style type="text/css">
  body {
   font-family: verdana, arial, sans-serif;
  }
  </style>  
 </head>
 <body>
  <h1>Title of Page</h1>
  <p>This is a sample paragraph with a 
  <a href="http://www.wbex.ru">link</a>.</p>
 </body>
</html>



Set font size for body

 
<!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">
    <head>
        <title></title>
<style type="text/css">
body {
  font-size: 62.5%;
  margin: 10% 10% 20% 10%;
}
</style>
    </head>
    <body>
<div id="frame">
    <h1>Header 1</h1>
    
   
    <p>This is a test.</p>
</div>
    </body>
</html>



Set margin for body to"

 
<!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">
    <head>
        <title></title>
<style type="text/css">
body {
  font-size: 62.5%;
  margin: 10% 10% 20% 10%;
}
</style>
    </head>
    <body>
<div id="frame">
    <h1>Header 1</h1>
    
   
    <p>This is a test.</p>
</div>
    </body>
</html>



Set repeat to repeat-x for <body>

 
<!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">
    <head>
        <title></title>
<style type="text/css">
body {
 background-image: url(bkgd.jpg);
 background-repeat: repeat-x;
}
</style>
    </head>
    <body>
    </body>
</html>



Single paragraph in body

 
<?xml version = "1.0"?>
<!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>Internet and WWW How to Program - Welcome</title>
   </head>
   <body>
      <p>Welcome to XHTML!</p>
   </body>
</html>
Источник — «http://wbex.ru/index.php?title=HTML/CSS/Basic_Tags/body&oldid=5993»