ul liを使ってリスト化した時に、長めの文章量だと真ん中に寄せる必要もなく気にならないのですが、短すぎないけどレイアウト的にな～んか中途半端な量の時があります。そんな時は箇条書きのまま真ん中に寄せてみましょう。
【CSS】ul liを箇条書きしたままwidthやtext-alignを使わずに真ん中寄せにする方法
CATEGORY CSS
ホームページ制作にはCSSは必須です。文字の色を変えたい、写真の位置を移動したい、ページ全体に装飾を施したいなど、CSSは綺麗なページを作る際には必要不可欠なプログラムです。
【CSS】テキストに影をつける時はshadow-boxじゃなくtext-shadowを使おう
テキストに影を付けようと思ったのですが、あれ？影が付かない・・・なぜだ？ちゃんとshadow-boxをかけているのに。実はテキストに影を付けるにはshadow-boxではなくtext-shadowを設定する必要があります。
【CSS】文字をぼやけた状態から表示するアニメーション
文字がぼやけた状態から表現されるアニメーションをCSSで作っていきます。CSSアニメーションは色々できますねぇ。
【CSS】CSSだけで円グラフを作る
CSSだけで円グラフを作ってみたいと思います。今回はCSSのconic-gradient関数がキーポイントになります。
【CSS】マウスオーバーでオブジェクトをクルっと回転させてみる
マウスを乗せると指定した部分がクルっと回転するオブジェクトを作ってみました。ボタンのちょっとした演出にも使えるかも。
【CSS】背景色を使ってビジュアライザーの様な動きを再現する
ボールがピョンピョン跳ねる様に見える動きをCSSだけで作ってみたいと思います。落下初動と着地地点の動きが跳ねる感じを見せる重要点ですね。
【CSS】CSSだけでピョンピョン跳ねるボールを作ってみる
ボールがピョンピョン跳ねる様に見える動きをCSSだけで作ってみたいと思います。落下初動と着地地点の動きが跳ねる感じを見せる重要点ですね。
【CSS】CSSを使ったアニメーションでボールコロコロレース
CSSのアニメーションを使ってボールをコロコロ転がしてみたいと思います。ただ転がすだけだと面白くないので、二つのボールの転がし方を変えてレースをしている様なアニメーションを作ってみましょう。
【CSS】疑似クラス「-child」を使った色々な順番指定のまとめ
今や疑似クラスで順番を指定する方法が当たり前になりました。単純な指定方法はよく使いますが、たまにしか使わない「何番目から何番目までの指定」などは毎回忘れてしまいますので、順番指定の疑似クラスをまとめておきます。
【CSS】CSSだけで順番に点滅して光る装飾ボタンを作る
CSSのアニメーションだけを使って順番に点滅する装飾ボタンを作っていきます。js使わなくてもanimationだけで色々できてCSSも楽しいものです。
