CSS制作各种样式的彩虹效果(3)

            border: solid 10px #ffff00;   

            box-sizing: border-box;   

            content: "";   

        }   

        .box3{   

            margin-top: -160px;   

            margin-left: 40px;   

            width: 340px;   

            height: 160px;   

            overflow: hidden;   

        }   

        .box3::before{   

            float: left;   

            display: block;   

            width: 320px;   

            height: 320px;   

            border: solid 10px blue;   

            border-radius: 100%;   

            box-sizing: border-box;   

            content: "";   

        }   

效果：

css样式三，使用的是box-shadow：

CSS Code复制内容到剪贴板

.box4{   

            width: 200px;   

            height: 200px;   

（编辑：ASP站长网）