マークを中央にする
470 ワード
方法は3つあります.
★トップ、bottom、左、右コンセプトも重要!
※このラベルにはwidthとheightの固定値が必要です.
✔親オブジェクトに対して、中央の子オブジェクトを絶対にします.
たとえば、親オブジェクトはbody、子オブジェクトdivラベルのidはcenterです.
(bodyなので関係を設ける必要はありません.)
margin : 0 auto;
★トップ、bottom、左、右コンセプトも重要!
①位置:絶対とエッジ
※このラベルにはwidthとheightの固定値が必要です.
✔親オブジェクトに対して、中央の子オブジェクトを絶対にします.
たとえば、親オブジェクトはbody、子オブジェクトdivラベルのidはcenterです.
(bodyなので関係を設ける必要はありません.)
#center {
position: absolute;
width: 300px;
height: 200px;
top: 50%;
left: 50%;
margin: -150px 0 0 -150px
}
top、leftが50%を与えることは、真ん中に位置することを意味しません.この要素の左上隅の開始位置は真ん中にあり、マージン値を調整する必要があります.margin : 0 auto;
Reference
この問題について(マークを中央にする), 我々は、より多くの情報をここで見つけました https://velog.io/@ono212/태그-정중앙에-위치시키기テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol