CSS

Web制作の勉強中のみなさん、こんにちは。 今回は、画像の大きさを自動調節する方法をご紹介します。 「最適化」といった方がいいのかな。   レスポンシブデザインで画像の大きさを変えたい時があ ...

「:hover」を使ったテクニックを３つ紹介します。   ポイント hover設定した要素と異なる要素をアクションさせる方法 擬似要素をアクションさせる方法 ボーダーを使ったアニメーション ...

今回は grid で並べた要素を中央に寄せる方法を紹介します。 親要素のなかに、複数の子要素をgridで並べたとき、 「中央に寄せたい」って思うときありますよね。 でも、どうやるの？ と思った方に紹介 ...

今回は、Google Fonts の使い方を紹介します。 それほど難しくありませんが、私が初めて使用した時、少しわかりづらかったので、 初心者さん向けに手順を紹介していきます。   Goog ...

今回のテーマは　flex　です。 ヘッダーにおいて、ロゴとナビゲーションの高さを中央でそろえる方法を紹介します。 ロゴが左にあって、右側にナビゲーションがある。 というのはヘッダーのよくあるパターンで ...

プログラミングを勉強中のみなさん、こんにちは！ 今回は、flex-direction:column; で要素を縦並びにして、中央でそろえる方法を紹介します。 flex-direction まずは fl ...

今回は、ヘッダーを固定したら、メニューが左寄せになってしまった！ というエラーを解決します。 とっても簡単ですので、ぜひ参考にしてください。 初心者向けのメモ書きとして執筆しておりますので、あしからず ...

今回は、「hoverアニメーションが効かない！」を解決します。   気に入ったhoverアニメーションをさっそく実装！ CSSでhoverを設定し、いざ確認！ すると・・・・ 「ん、効かない ...

<a>タグでリンクを作ったら文字の色が黒じゃない。 しかも下線まで付いている。 文字は黒でいいし、下線もいらない。 とお困りの方へ、<a>タグの文字色を変えない方法を２つ紹介し ...

今回は、画像を暗くする方法を紹介します。 下の画像のように、文字がいまいち目立たない・・・。 というときに使えます。 背景画像を暗くして、画像の上に載せた文字をきわだたせることができます。 さっそく見 ...