Skip to content

Instantly share code, notes, and snippets.

@Johnqing

Johnqing/sawtooth-back-images.less

Created June 2, 2015 10:16
Show Gist options
  • Save Johnqing/95d8e4b01835de5d0a2e to your computer and use it in GitHub Desktop.
Save Johnqing/95d8e4b01835de5d0a2e to your computer and use it in GitHub Desktop.
Download ZIP
连续锯齿
Raw
sawtooth-back-images.less
.bg-bottom(@bgColor){
background: @bgColor;
background-image: ~'-webkit-linear-gradient(135deg, #fff 25%,transparent 25%), -webkit-linear-gradient(45deg, #fff 25%, transparent 25%)';
background-size: 10px 5px;
background-repeat: repeat-x;
background-position: -4px 100%;
}
@Johnqing
Copy link
Author

Johnqing commented Jun 2, 2015 

<div class="w">
<div class="border">
    <svg width="100%" height="10">
  <defs>
    <pattern width="20" height="10" id="c1" patternUnits="userSpaceOnUse">
      <path d="M0 0 L10 10 L20 0 Z" fill="currentColor"></path>
    </pattern>
  </defs>
  <rect x="0" y="0" width="100%" height="10" fill="url(#c1)"></rect>
</svg>
</div>
</div>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment