1. position 속성 - relative, absolute, fixed
relative
원래 있던 위치를 기준으로 좌표를 지정한다.
absolute
relative를 기준으로 좌표를 지정한다.
fixed
항상 문서 최 좌측상단을 기준으로 좌표를 고정한다.
좌표를 지정 해주기 위해서는 left, right, top, bottom 속성과 함께 사용해야 한다.
display:fixed로 고정 후에는 justify-content: '' 로 위치를 지정해준다.
justify-content: flex-start;
justify-content: flex-end;
justify-content: center;
justify-content: space-between;
justify-content: space-around;
justify-content: space-evenly;
링크텍스트flex박스 참고
2. inline, inline-block, block 에 대해서
inline
주로 텍스트를 입력 할 때 사용.
컨텐츠의 영역만큼 자동으로 잡힘 높이 또한 폰트크기만큼 잡힘
width와 height를 명시 할 수 없다.
margin은 위아래엔 적용 되지 않는다.
padding은 좌우는 공간과 시각적인 부분이 모두 적용 되지만 위아래는 시각적으로는 추가되지만 공간을 차지 하지는 않는다.
<a>, <i>, <span>, <abbr>, <img>, <strong>, <b>, <input>, <sub>, <br>, <code>, <em>, <small>, <tt>, <map>, <textarea>, <label>, <sup>, <q>, <button>, <cite>block
한 영역을 차지 하는 박스형태를 가지는 성질. width 값은 100%
block은 height와 width 값을 지정 할 수 있다.
block은 margin과 padding을 지정 할 수 있다.
<address>, <article>, <aside>, <blockgquote>, <canvas>, <dd>, <div>, <dl>, <hr>, <header>, <form>,<h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <table>, <pre>, <ul>, <p>, <ol>, <video>inline-block
줄바꿈이 이루어지지 않는다.
block처럼 width와 height를 지정 할 수 있다.
만약 width와 height를 지정하지 않을 경우, inline과 같이 컨텐츠만큼 영역이 잡힌다.
inline과 inline-block 특징을 모두 가진 요소이다.
