2行目から字下げする為にはpaddingとindentを併用して設定しますが、任意の場所から改行して字下げするにはspanを使いましょう!
CATEGORY CSS
ホームページ制作にはCSSは必須です。文字の色を変えたい、写真の位置を移動したい、ページ全体に装飾を施したいなど、CSSは綺麗なページを作る際には必要不可欠なプログラムです。
flexで幅固定と幅可動を横並びにするリキッドレイアウト
flexを使ってブロック要素を均一幅にするのはよく使います。今回は片方は固定、片方は可動できる要素を横並びするリキッドレイアウトを作ってみます。
【CSS】ul liを箇条書きしたままwidthやtext-alignを使わずに真ん中寄せにする方法
ul liを使ってリスト化した時に、長めの文章量だと真ん中に寄せる必要もなく気にならないのですが、短すぎないけどレイアウト的にな~んか中途半端な量の時があります。そんな時は箇条書きのまま真ん中に寄せてみましょう。
【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のアニメーションを使ってボールをコロコロ転がしてみたいと思います。ただ転がすだけだと面白くないので、二つのボールの転がし方を変えてレースをしている様なアニメーションを作ってみましょう。