css对角渐变

html:

<div class="hh">
</div>

css:

            .hh{
                width: 500px;
                height: 500px;
                background: #127feb;
                /* Old browsers */
                background: -moz-linear-gradient(-45deg, #66cdcc 0%, #66cdcc 100%);
                /* FF3.6+ */
                background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #66cdcc), color-stop(100%, #127feb));
                /* Chrome,Safari4+ */
                background: -webkit-linear-gradient(-45deg, #66cdcc 0%, #127feb 100%);
                /* Chrome10+,Safari5.1+ */
                background: -o-linear-gradient(-45deg, #66cdcc 0%, #127feb 100%);
                /* Opera 11.10+ */
                background: -ms-linear-gradient(-45deg, #66cdcc 0%, #127feb 100%);
                /* IE10+ */
                background: linear-gradient(-45deg, #66cdcc 0%, #127feb 100%);
                /* W3C */
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#66cdcc, endColorstr=#127feb, GradientType=1);
                /* IE6-9 fallback on horizontal gradient */
            }

 

posted @ 2018-05-15 09:18  huahua_0825  阅读(299)  评论(0编辑  收藏  举报