CSS3のみで斜線ボーダーの背景装飾を実装してみる | helog10px程度の斜線の画像を用意し、それを背景に繰り返し表示してボーダー装飾しているサイトをよく見かけます。 今回、それを画像を用いずにCSS3だけで実現してみます。 まず、線形グラデーションを使ってラインを引きます。 25%、50%、75%のポイントで黒、白の両方を指定することで、グラデーションの境界を切り替えます。 クロスブラウザ対策で「-webkit-gradient」と「-moz-linear-gradient」を指定すると、CSSは以下のようになります。 background: -webkit-gradient(linear, left top, right top, from(black), color-stop(0.25, black), color-stop(0.25, white), color-stop(0.5, white), color-stop(0.5, bl
