728x90

미디어쿼리

max-width

최대여기 영역까지 css적용!

 

*그래서 순서도 큰 영역에서 작은 영역으로 써줘야 적용이 된다!!!!!!!

(이런느낌)

  @media screen and (max-width: 1440px) {
   
  }
  @media screen and (max-width: 1024px) {
   
  }

  @media screen and (max-width: 400px) {
   
  }

 

최소영역은 반대

작은 영역에서 큰영역으로 순서 써야함..

 

중앙정렬

중앙정렬할 때 

마진 오토가 안먹혀서 뭔가 했더니 가로값을 주어야했다!!

 position: fixed;
  /* fixed를 쓸 때에는 width, height를 명시해줘야 한다. */
  width: 460px
  /* left, right는 해당 요소의 위치 시작점을 결정한다. 그런데, 이때, margin의 양 값을 auto로 줌으로써 마진을 주어 해당 요소의 양 끝 위치를 각각 0으로 만들어준다. */
  margin: 0 auto;
  left: 0;
  right: 0;

출처 :https://wansook0316.github.io/dv/html-css/2020/03/19/position-fixed-center-%EC%A0%95%EB%A0%AC.html

 

////

position

postion: fixed

position:relative

position:absolute

....

https://developer.mozilla.org/ko/docs/Web/CSS/position

 

display:plex

 

 

 

728x90

'프론트 > Html Css' 카테고리의 다른 글

margin 값 방향  (0) 2021.10.26
box-sizing: border-box;  (0) 2021.10.26
box-shadow  (0) 2021.10.26
구조 가상 클래스 only-child /nth-of-type(n)  (0) 2021.08.23
:target :checked/ input type="checkbox"/필수입력창  (0) 2021.08.22

+ Recent posts