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>

    附件

  • 相关阅读:
    为恶畏人知,恶中犹有善路,为善而急人知,善处即是恶根。
    win7 64位 php环境开启curl服务Call to undefined function
    php根据汉字获取拼音(php基于拼音搜索实现原理)
    Fatal error: Call to undefined function mb_detect_encoding()
    学一点 mysql 双机异地热备份----快速理解mysql主从,主主备份原理及实践
    springMVC介绍及配置
    Java--详解WebService技术
    网站SEO优化
    Java温故而知新(5)设计模式详解(23种)
    java温故而知新(9)OOP(面向对象编程)理念
  • 原文地址:https://www.cnblogs.com/liushannet/p/1808751.html
Copyright © 2011-2022 走看看