HTML&CSS

HTML&CSS

【HTML&CSS】Flexboxを使って要素を上下左右に中央揃えにする方法

今回はFlexboxを使って、要素を上下や左右に中央揃えする方法を紹介します。 まずFlexboxを使用するためには、要素に対して"display: flex"を設定する必要があります。 そして、調整したい位置によって"display:...
HTML&CSS

たった4行のCSSでフッターを画面の最下部(一番下)に表示する方法【flexbox】

この記事では、フッターを画面の最下部(一番下)に固定して表示する方法を紹介します。 「フッターが画面の最下部に表示できず、困っている」という方は、以降で紹介している方法を試してみてください。 まずは、次のCodePenのHTMLをご覧く...
HTML&CSS

【HTML】画像の上に画像やアイコン、文字を重ねて表示する方法【CSS】

この記事では、「画像の上にアイコンや文字、画像を重ねて表示する方法」を紹介します。 まずは次の画像をご覧ください。 この画像では、右下に「いいね」ボタンを表示しています。 この表現はCSSの"position: absolute"...
HTML&CSS

【HTML】aタグで作ったリンクのクリック範囲を親要素のサイズに広げる方法【CSS】

この記事では、「aタグで作ったリンクのクリック範囲を、親要素と同じサイズに広げたい」とお困りの方に、解決方法を紹介しています。 デフォルトではどのように表示されるか? 例えばliタグとaタグを使ってリンクのリストを作った場合、標準だと次...