zoukankan      html  css  js  c++  java
  • HTML DOM CSS position的用法

    语法:

    Object.style.position=static|relative|absolute|fixed

    可能的值

    HTML DOM position 属性可能的值

    <!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">
    td{
    	60px;
    	height:59px;
    }
    .staticSpan{
    	position:static;
    	left:40px;
    }
    .relativeSpan{
    	position:relative;
    	top:20px;
    	left:20px;
    }
    .absoluteSpan{
    	position:absolute;
    	top:100px;
    	left:100px;
    }
    .fixedSpan{
    	position:fixed;
    	top:200px;
    	left:200px;
    }
    </style>
    </head>
    
    <body><table width="500" border="1" cellspacing="0" cellpadding="0">
      <tr>
        <td > </td>
        <td><span class="staticSpan">static<span></td>
        <td> </td>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td height="47"> </td>
        <td> </td>
        <td><span class="relativeSpan">relative</span></td>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td height="41"> </td>
        <td> </td>
        <td><span class="absoluteSpan">absolute</span></td>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td height="35"> </td>
        <td> </td>
        <td> </td>
        <td><span class="fixedSpan">fixed</span></td>
        <td> </td>
      </tr>
    </table>
    </body>
    </html>

    效果如下:

      static       
        relative    
        absolute    
          fixed  
  • 相关阅读:
    解决web网页访问慢的问题
    Django安装配置(for Mac)
    Django安装(for Mac)
    HTML5中的新事件
    关于http-equiv
    【转】@fant-face
    textarear中的value....还是...innertext
    清除浮动的元素的margin-top触碰不到,浮动元素的边界
    常用排序算法总结(一)
    JS常用特效方法总结
  • 原文地址:https://www.cnblogs.com/zcy_soft/p/1952365.html
Copyright © 2011-2022 走看看