css 一覧

よく使うtableのCSSデザイン サイト制作の会社概要や比較表、料金表などでよく使うtable。css設定についてまとめました。例にあげたのは、全部tdの場合です。thが入ると変わってくるものもあり …

隣接セレクタ・間接セレクタ・直下セレクタとは？ 隣接セレクタ 要素を結合子「+」でつなぎます。例えば要素A+要素Bの場合、要素Aと同じ階層にあるすぐ後の要素Bにスタイルがつきます。 間接セレクタ 要素 …

縦書き 文章を縦書きにして右から左へ流す。 縦書きの基本 文章を縦書きにして右から左へ流す。 親{text-align:right; display: inline-block;} 子{writing …

上下センター揃え フレックスボックス 「display: flex」を使います。 セレクタ{display: flex; justify-content: center; align-items: c …

cssでテキストに縁や影をつけます。

CSSでドロップシャドウをつける方法を二つ紹介します。

鮮やかなグラデーションを取り入れたサイトをよく見ます。 様々なタイプのグラデーション記述方法をまとめてみました！ グラデーションの種類 基本 グラデーションはbackgroundで指定します。先に書い …

JavaScriptを使わずにCSSだけでアニメーションを表現！CSS Animationキーフレームは0％（アニメーションの開始）から100％（終わり）まで細かく指定できます。

CSSのアニメーション、Transitionに変化を追加してオンマウスで滑らかに変化させたり、押す感を出せたり。これだけでちょっとインタラクティブなサイトになりますね！