CSS中边偏移属性top，right，bottom，left-CFANZ编程社区

1：上边偏移属性

用来定义元素顶部偏移位置的大小。top: auto | length | percent

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> CSS属性实例 </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style>
    div{
    top: 100px;
    position: absolute;
    border: 2px solid #333333;
    background: #666666;
    width: 300px;
    height: 50px;
  }
  </style>
 </head>

 <body>
   <div>这是使用边偏移属性的实例</div>
 </body>
</html>

CSS中边偏移属性top，right，bottom，left_3c

2：右边偏移属性right

用来定义元素右侧偏移位置的大小。right: auto | length | percent;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> css属性实例 </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style>
    div{
    right: 100px;
    position: absolute;
    border: 2px solid #333333;
    background: #666666;
    width: 300px;
    height: 50px;
  }
  </style>
 </head>

 <body>
  <div>这是使用边偏移属性的实例</div>
 </body>
</html>

CSS中边偏移属性top，right，bottom，left_css_02

3：下边偏移属性bottom

用来定义底部偏移位置的大小。bottom:auto | length | percent;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> css属性实例 </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style>
    div {
    bottom: 100px;
    position: absolute;
    border: 2px solid #333333;
    width: 300px;
    height: 50px;
    }
  </style>
 </head>

 <body>
  <div>这是使用下边偏移属性bottom</div>
 </body>
</html>

CSS中边偏移属性top，right，bottom，left_html_03

4：左边偏移属性left

用来定义元素左边偏移位置的大小，left: auto | length | percent;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style>
     div {
     left: 100px;
     position: absolute;
     border: 2px solid #333333;
     background: #666666;
     width: 300px;
     height: 50px;
   }
  </style>
 </head>

 <body>
   <div>这是使用左边偏移属性的实例</div>
 </body>
</html>

CSS中边偏移属性top，right，bottom，left_css_04