よくある面倒なタスクのお助けに！使えるCSSスニペット25選【part1】

本記事では、前半後半併せて27のＣＳＳスニペットを紹介します。
いずれもよく必要になる、フラストレーションのたまるタスクを解消するのに役立ってくれるスニペットです。
もはやクラシックとさえ言えるようなものから、比較的新しいＣＳＳ3スニペットもあります。
ぜひ役立ててください。
 
part2はこちらです。
 
１．テキストに影をつける：text-shadow
テキストが他より目立ちます。
 
２．画像ベースのボーダーを追加する：border-image
Border.png画像を用意して、border-imageプロパティをオブジェクトに追加すれば、ウェブサイトのオブジェクトに好きなボーダーを追加できます。
 
３．ボーダーや画像に影をつける：box-shadow
背景から３Dのようにボーダーや画像を浮き上がらせることができます。
 
４．角を丸くする：border-radius
ボーダーやボタンなどのCSS3エレメントの角を丸くすることができます。丸める度合いを調整することも可能です。
 
５．個別に角を丸くする：border-radius
どの角を丸くして、どの角をそのままにしておくか選択することができます。
 
６．グラディエントを追加する：linear-gradient
CSS3ではグラディエン

リンク元