HTML/CSS/CSS Attributes and Javascript Style Properties/height

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

height: 100px

 
<?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>height and width properties</title>
  <style rel="stylesheet" type="text/css">
body {
  font-size: 12px;
}
p.one {
  width: 200px;
  height: 100px;
  padding: 5px;
  margin: 10px;
  border-style: solid;
  border-color: #000000;
  border-width: 2px;
}
p.two {
  width: 300px;
  height: 100px;
  padding: 5px;
  margin: 10px;
  border-style: solid;
  border-color: #000000;
  border-width: 2px;
}
</style>
</head>
<body>
<p class="one">This paragraph should be 200 pixels wide by 300 pixels high.</p>
<p class="two">This paragraph should be 300 pixels wide by 100 pixels high.</p>
</body>
</html>



"height" Example

    
<html>
<body>
<p> 
<img id="myImg" 
     src="http://www.wbex.ru/style/logo.png" 
     style="width:74; height:100">
</p>
<input type="button" 
       value="Reduce height" 
       onclick="myImg.style.height=50">
<input type="button" 
       value="Restore height" 
       onclick="myImg.style.height=100">
</body>
</html>