zoukankan      html  css  js  c++  java
  • 兼容ie6浏览器窗口四角固定背景代码

    昨天有网友提问“如何在html页面四角放置图片”,下面就是答案,供这位网友参考。

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2 <html xmlns="http://www.w3.org/1999/xhtml">
    3 <head>
    4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    5 <title>浏览器窗口四角固定背景代码</title>
    6 <style type="text/css">
    7 html{
    8 _overflow:hidden;/*for ie6*/
    9 }
    10 body {
    11 margin:0;
    12 padding:0;
    13 _height:100%;/*for ie6*/
    14 _overflow:auto;/*for ie6*/
    15 }
    16 .mainbox {
    17 position:relative;
    18 _position:inherit;/*for ie6*/
    19 margin:20px;
    20 display:block;
    21 height:2000px;
    22 background:#e2e2e2;
    23 }
    24 .topleft, .topright, .bottomleft, .bottomright {
    25 position:fixed;
    26 width:100px;
    27 height:100px;
    28 background-color:#990;
    29 _position:absolute;/*for ie6*/
    30 _z-index:-1;/*for ie6*/
    31 }
    32 .topleft {
    33 left:0;
    34 top:0;
    35 }
    36 .topright {
    37 right:0;
    38 top:0;
    39 }
    40 .bottomleft {
    41 left:0;
    42 bottom:0;
    43 }
    44 .bottomright {
    45 right:0;
    46 bottom:0;
    47 }
    48 </style>
    49 </head>
    50 <body>
    51 <div class="topleft"></div>
    52 <div class="topright"></div>
    53 <div class="bottomleft"></div>
    54 <div class="bottomright"></div>
    55 <div class="mainbox">这里是内容区域填充文字</div>
    56 </body>
    57 </html>
  • 相关阅读:
    前端开发者也可以酷酷地开发桌面程序
    V部落,V人事
    jq 正方体旋转
    jq 实现旋转木马
    jquery 获取元素(父节点,子节点,兄弟节点)
    Vue.js面试题整理
    Java面试必备技能
    在前后端分离的SpringBoot项目中集成Shiro权限框架
    正则表达式大全
    Docker容器日志查看与清理
  • 原文地址:https://www.cnblogs.com/imyeah/p/2353070.html
Copyright © 2011-2022 走看看