三角锯齿背景

三角锯齿背景

<html>

    <head>

        <style type="text/css">
            .bg {
                width: 100%;
                height: 20px;;
                background-image: -webkit-gradient(linear, 50% 0, 0 100%, from(transparent), color-stop(.5, transparent), color-stop(.5, #d86707), to(#d86707)), -webkit-gradient(linear, 50% 0, 100% 100%, from(transparent), color-stop(.5, transparent), color-stop(.5, #d86707), to(#d86707));
                background-image: -moz-linear-gradient(50% 0 -45deg, transparent, transparent 50%, #d86707 50%, #d86707), -moz-linear-gradient(50% 0 -135deg, transparent, transparent 50%, #d86707 50%, #d86707);
                background-size: 30px 15px;
                background-repeat: repeat-x;
                background-position: 0 100%;
            }
        style>
    head>

    <body>
        <div class="bg">div>
    body>

html>

 

发表评论

邮箱地址不会被公开。 必填项已用*标注