css实现丝带效果-html代码-BFW代码库

css实现丝带效果

代码语言：html

所属分类：背景

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <style>
        .wrapper {
            float: left;;
            margin: 10px;
            width: 290px;
            height: 370px;
            background: white;
            border-radius: 10px;
            -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.3);
            -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.3);
            box-shadow: 0px 0px 8px rgba(0,0,0,0.3);
            position: relative;
            z-index: 90;
        }

        .ribbon-wrapper-green {
            width: 85px;
            height: 88px;
            overflow: hidden;
            position: absolute;
            top: -3px;
            right: -3px;
        }

        .ribbon-green {
            font: bold 15px Sans-Serif;
            color: #333;
            text-align: center;
            text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            position: relative;
            padding: 7px 0;
            left: -5px;
            top: 15px;
            width: 120px;
            background-color: #BFDC7A;
            background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45));
            background-image: -webki.........完整代码请登录后点击上方下载按钮下载查看