画像を使わなくてもCSS3だけでできるかっこいい水平線（hr）いろいろ | 日刊ウェブログ式

CSS3を使うと、画像を使わなくても、色んなバリエーションの水平線（hr）が作れます。ということで、この記事ではかっこいい水平線の作り方をご紹介します。 両端が薄くなっているタイプの水平線 hr.style-two { border: 0; height: 1px; background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75)