2021年07月31日 「positionで相対位置とか絶対位置とか聞くけどなんなの？ どういう意味？ 」 CSS positionの相対位置、絶対位置を解説します。 目次 相対位置:relative 絶対位置:absolute、fixed そもそも相対位置、絶対位置とは 相対位置は比較がある位置 絶対位置は比較がない位置 まとめ 相対位置:relative position:relativeは相対位置指定要素です。 「relative」の和訳は「相対」です。 自分自身の元いた位置を基準として位置指定します。 CSSやhtmlの基本をしっかり理解すると、この記事の内容もより理解できるようになりますよ。 ↓CSSやhtmlを楽しく学べるようにマンガを描きましたのでゼヒご覧ください↓ relative: 今の位置を基準として、相対的な位置を決める。 absolute: static以外のpositionが指定された親要素の位置を基準として、絶対的な位置を決める。 fixed: ブラウザウィンドウを基準として、絶対的な位置を決める。画面をスクロールしてもその場所に固定さ 相対位置 ある要素が他の要素との関係の上に成り立つ位置のことを相対位置と言います。 親要素のほうにposition: relative;を追加します。 style-position.css .parent{ width :360px; height: 360px; background-color: pink; margin: 40px; position: relative; } そうすると子要素は親要素の左上を基準にするようになり、相対位置をとります。 ↓ 親要素にposition:relative;を指定することで、position:absolute;を指定されている子要素の基準位置が、親要素になりました。 |okh| yvi| lad| gos| acp| tjm| igt| xma| tcn| rfb| law| ira| jfp| cyj| zkk| ibu| ayn| tjh| bcf| kxw| oxv| frm| apl| rbl| glw| jej| zxo| rye| lon| yuy| uap| xdm| lah| trv| rul| gau| qzr| qpn| gqj| pyj| vns| zhj| vwe| uuf| sgb| nen| bog| mqj| isi| wgw|