2021. 11. 17. (수) 코코아 클론 - CSS_06

# 학습 전 나의 상태

어제까지 배운 css 등을 보면 지금까지 내가 배운.. 또는 공부한 css는 진짜 아무것도 한게 아니었구나.. 하는 생각이 들었다.

노마더 코더를 통해서 이렇게 자세하게 배울 수 있어서 좋다. 이제야 개발자 분들이 css가 가장 힘들다는 말이 왜 그런지 알 것 같다..

그래서 더 잘 정리하고 공부가 필요할 것 같다. 무튼.. 결론은 재미있다.

 

 

# 오늘의 학습 내용

Media Queris

body {
      display: flex;
      height: 100vh;
      align-items: center;
      justify-content: center;
}
div {
  background-color: steelblue;
  width: 200px;
  height: 200px;
}
/* 스크린 너비가 최소 600px, 최대 1200px 일 때
and를 써서 연결한다. 
*/
@media screen and (min-width: 601px) and (max-width: 1200px) {
  /* 원하는 element 에 css를 넣어준다.  */
  div {
    background-color: blueviolet;
  }
  span {
    font-size: 36px;
  }
}
@media screen and (orientation: landscape) {
	span {
    	display: none;
    }
}

 

 

# 학습을 마치며

오늘은 미디어커리에 대해서 배웠다.

반응형이 좀 어렵게 느껴졌었는데 이 강의를 통해서 조금 이해가 되기 시작했다.

암튼 요즘.. 코딩이 재미있다.