HTML
min-widthとmax-widthの使い方 最小幅と最大幅
min-widthとmax-widthとは? レスポンシブデザインでよく使われます。 レスポンシブデザインとはスマホでもPCでも、どんな大きさの端末で見てもちょうどいい大きさに表示されるWebデザインのことです。 レスポ …
要素のボックスからはみ出た部分をどうするか?overflowの意味と使い方の説明
overflowとは? overflowとはCSSのプロパティの1つで「要素のボックスからはみ出た部分をどうするか」を指定します。 【overflowは以下のように記述します。】 ◯◯ {overflow:値;} ove …
高さの変え方、高さの指定の方法 heightの使い方
heightとは? heightプロパティ(高さ)の説明をしていきます。 heightもwidthと同じ3つの値を取り、初期値はautoになります。 ただ、各値の決まり方が少しずつ異なるので1つずつ説明していきます。 【 …
幅の変え方、指定の方法 widthの使い方
widthとは? 指定方法には、実数値にpxなどの単位をつけて指定する方法と、親ボックスに対する割合を%で指定する方法と、 状況に応じて大きさが設定されるautoを指定する方法があります。widthプロパティに負の値(- …
文字や画像の位置を左寄せ・右寄せや真ん中にするには方法
text-alignとは? text-align CSS プロパティは、テキストのようなインラインコンテンツが、その親ブロックの中でどのように文字寄せされるのかを定義します。 text-alignはテキストなどのインライ …
簡単便利!Font Awesomeを使ってみましょう!3
こんにちは。フローラです。 前回はFont Awesomeの使い方応用編で、アイコンの大きさや色を変えたりくるくる回したりしました。 Font Awesomeを初めて使ってみると、色々なカスタマイズのアイデアが浮かぶかも …
要素の位置を変えたい、移動したい時はPositionプロパティの使い方
要素の位置を変えたい、移動したい時はPositionプロパティの使い方 positionは各要素の配置に関する基準を設定するプロパティです。 その要素が本来ある位置を基準とする方法(相対位置)や、直接配置場所を設定して配 …
要素を自由に配置できる CSS フレキシブルボックスの使い方
CSS フレキシブルボックスとは? Flexboxとは「Flexible Box Layout Module」のことで、その名の通り簡単にレイアウトが組むことができるボックスです。 前々からあった技術なようですが、ブラウ …
float(フロート)の使いかた
float(フロート)の使い方について floatとは、指定された要素(<div>とか<p>)を右に寄せたり、左に寄せたりするときに使います。 ウェブサイトで見られるサイドバーやサイドメニューとか …
簡単便利!Font Awesomeを使ってみましょう!2
こんにちは!フローラです。 前回の私の記事ではFont Awesomeについてご紹介しました。 Font Awesomeを使う準備作業、基本的な使い方について解説しましたが、綺麗に表示されましたでしょうか!? 今回は応用 …