吹き出しをデザインする

ブラウザ対応の方針と方法

Webフォントの基本を知る

before/after擬似要素を使いこなす

フレキシブルボックスレイアウト（flexbox）

透明度（rgba）

透明度（opacity）

グラデーション（linear-gradient,radial-gradient）

影 （box-shadow, text-shadow）

角丸 (border-radius)

CSS3で追加されたセレクタ

メディアクエリ メディアクエリは、ウィンドウのサイズやモニターの物理サイズ、画面密度やデバイス向きなど、閲覧環境の特性（メディア特性）に応じてCSSを分岐させることができる機能で、CSS2.1の時代から使われている media属性の拡張として定義されてい…

transition（トランジションアニメーション） transition は、「:hover」などの動作をきっかけとして、アニメーションでプロパティの値を変化させることができるプロパティです

transform-origin（変形の原点） ローカル座標の原点は、transform-origin の値を変更することでいつでも変更できます 変形の原点を変更する

transform（変形） transformプロパティは、二次元座標での変形を行うプロパティです 値に translate( ) / scale( ) / rotate( ) / skew( ) の４種類のトランスフォーム関数を取り、それぞれ移動・拡大縮小・回転・傾斜させることができます 移動の書式 tran…

CSS3のプロパティ テキストP.276 まず、CSS3で表現してみる CSS3で角丸を設定する <section> <h3>border-radius</h3> <ul class="sample bdr"> <li class="bdr01">全て同じ</li> <li class="bdr02">左上 | 右上 | 右下 | 左下</li> <li class="bdr03">左上 | 右上と左下 | 右下</li> <li class="bdr04">左上と右下 | 右上と左下</li> <li class="bdr05">正円</li> </ul> </section> /* bor…

CSS3を使うメリット（テキスト P.258） classやidに頼らないセレクタ作りが可能になる CSS3だけで表現できるデザインの幅が広がる 簡単に柔軟な他段組を実現できるようになる CSSだけで「動き」をつけられるようになる CSS3は下位互換 CSS3は、CSS2.1を含み…