ストライプの背景を作る時は、線グラデーション linear-gradient をX方向・Y方向に繰り返す repeating-linear-gradient を使った。見出しの下につけるギザギザを作る時は、線グラデーション linear-gradient で作った2つの背景を重ねてX方向にだけ繰り返す。

疑似要素を使って見出しにカフェのテント風の飾りをつける。（ヘッダーでも使える。）30pxの正円の画像を作って、15pxの高さの疑似要素tent1の背景にして使って、くっつけてる。

吹き出しの見出しを作る時は、文字の入った枠の下に同色の小さな三角を敷いた。リボンの見出しを作る時は、文字の入った枠の上に白い三角をのせて、その部分が切り取られているように見せる。

疑似要素 :before, :after　 最初はとても難しく考えていたけれど、簡単に色んなものをくっつけられて便利♪見出しの文字を入れた枠に色、サイズ、位置など指定して三角をくっつければ吹き出しの見出しができる。

ドット（水玉）の背景を作る時は円グラデーションのradial-gradientを使う。 background-size: 20px 20px;→敷き詰める背景１マス分のサイズ。background-image: radial-gradient(#ffbfbf 20%, transparent 0), radial-gradient(#ffbfbf 20%, transparent 0);

ストライプの背景を作る時は線グラデーションを繰り返すrepeating-linear-gradientを使う。background:repeating-linear-gradient(45deg, #ffe1e1, #ffe1e1 5px, #ffffff 5px, #ffffff 10px); (向き＝角度,１つ目のグラデ―ションの開始カラーと開始位置,終了カラーと終了位置,２つ目の開始カラーと開始位置,終了カラーと終了位置)

背景の線グラデーションの基本の書き方はbackground:linear-gradient(向き, 開始カラーと開始位置%, 終了カラーと終了位置%);※グラデーションの開始位置が0%、終了位置が100%の時は、それぞれ省略できる。

border-radius:○px;　で全ての角の丸みをまとめて指定。それぞれ指定する時は　border-radius:左上の角、右上の角、右下の角、左下の角。

ドロップシャドウをつける時はbox-shadow : X軸のオフセット Y軸のオフセット ぼかし 色 。色の指定は、カラー番号またはRGBa(R,G,B,0～1であらわす透明度)で。