zoukankan      html  css  js  c++  java
  • css 圆角相框

    文件都在附件,下面是代码:

    代码
    <!DOCTYPE html PUBLIC "./W3./DTD HTML 4.01 Transitiona./EN" "http./www.w3.org/TR/html4/loose.dtd">
    <html>
        
    <head>
            
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            
    <meta http-equiv="Content-Language" content="utf-8"/>
            
    <title>Web Site</title>
            
    <!--css 圆角相框 
                测试通过Firefox3.68 IE6.7.8
                作者:lonely 
                最大支持:宽450 高:560 
                最小支持:宽:50 高50 
                需要其他高度请自己修改图片并调整以下CSS参数,PSD背景在附件
                rudblbg和rudbrbg 背景直接用bottom会向下偏离8个像素左右,原因不详,知道的告诉下
            
    -->
        
    </head>
        
    <body>
            
    <style>
                .rudallbg
    {
                    float
    :left;
                    width
    :100px;
                
    }
                .rudtlbg
    {
                    overflow
    :hidden;
                    float
    :left;
                    width
    :84%;
                    height
    :8px;
                    background
    :url(./rubbg.png) left top no-repeat;
                
    }
                .rudtrbg
    {
                    overflow
    :hidden;
                    float
    :right;
                    width
    :16%;
                    height
    :8px;
                    background
    :url(./rubbg.png) right top no-repeat;
                
    }
                .rudccbg
    {
                    padding
    :0px 0px 0px 8px;/*不能左右为8px,当插入图片时候IE6撑开了,可恶的IE6,还我浪费了2个多小时,这下完美解决了*/
                    overflow
    :hidden;
                    height
    :100%;
                    background
    :url(./rubbg.png) left  -7px no-repeat;
                    border-right
    :1px solid #ccc;
                
    }
                .rudblbg
    {
                    overflow
    :hidden;
                    float
    :left;
                    width
    :84%;
                    height
    :8px;
                    background
    :url(./rubbg.png) left -569px no-repeat;
                
    }
                .rudbrbg
    {
                    overflow
    :hidden;
                    float
    :right;
                    width
    :16%;
                    height
    :8px;
                    background
    :url(./rubbg.png) right -569px no-repeat;
                    background
    :url(./rubbg.png) right -569px no-repeat;
                
    }
            
    </style>
            
    <div class="rudallbg">
                
    <div class="rudtlbg"></div>
                
    <div class="rudtrbg"></div>
                
    <div class="rudccbg">
                    da fas df af df da fas df af dfda fas df af dfda fas df af dfda fas df af df
                    da fas df af dfda fas df af dfda fas df af dfda fas df af dfda fas df af df
                    da fas df af dfda fas df af dfda fas df af dfda fas df af dfda fas df af dfda fas df af df
                    da fas df af dfda fas df af dfda fas df af df
                
    </div>
                
    <div class="rudblbg"></div>
                
    <div class="rudbrbg"></div>
            
    </div>
        
    </body>
    </html>

    附件

  • 相关阅读:
    MySQL四种分区类型
    CentOS下升级MySQL 5.0.* 到5.5
    CentOS5.5使用yum来安装LAMP
    mysql-bin 常见操作
    引爆你的Javascript代码进化
    python读写excel的简单方法demo
    python时间戳数字转为字符串格式表达
    Djang——CSRF verification failed. Request aborted
    Apache部署django
    Qt设置windows系统时间
  • 原文地址:https://www.cnblogs.com/liushannet/p/1808751.html
Copyright © 2011-2022 走看看