WEB2 - CSS

반응형 디자인

반응형 디자인과 미디어 쿼리 소개

강의

 

 

소스코드

변경사항

 

 

 

미디어 쿼리를 이용해서 반응형 디자인 구현하기

강의

 

 

소스코드 

변경사항

 

댓글

댓글 본문
  1. WinnieKim
    5/26
  2. HyeonHui Jeong
    5/24
  3. goodluck
    미디어 쿼리
  4. k_ego
    4/8 13:51 check
  5. 슈우잉
    완료
  6. 그래난쭈구리
    큰 도움이 되었습니다.

    정말 감사합니다.
    대화보기
    • Yunnew Yun
      done
    • 미디어쿼리

      화면이 800px보다 작을 때 hide
      @media(max-width:800px) {
      div{
      display:none;
      }
      (min 클 때)
    • 완료 200427
    • 완료
    • 코딩하는렌즈쟁이
      2020-04-16
      반응 웹 디자인
      화면의 크기에 따라서 웹페이지의 각요소가 반응 하는것
    • 유종수
      반응형 웹이 너무 어려울 것 같아서 시작조차 않 하고 있었는데, 영상 잘 봤습니다.
    • opencoder
      완료입니다 감사합니다!
    • 망나녕
      와... 한 기술이 발전함에 따라 다른 기술들도 덩달아 발달하네요 멱살 잡고 끌고 가는 느낌??
      들으면서 가슴이 두근두근 했습니다 재미있네요
    • 태현
      4/6
      감사합니다.
    • 혹등고래
      완료
    • Mongsil
      2020.04.01완료 감사 합니다!
    • 둥치둥치아재
      굿 힌트 감사합니다
      대화보기
      • 둥치둥치아재
        와~ 진짜 쉽다 쉽다 하면서 보다 보니까 슬슬 용어나 내용들이 짬뽕쓰...
      • lovejun
        완료
      • 완료
      • green diseny
        오케이 주말인데도 공부하니깐 뿌듯하네 ㅎㅎ 역시 재미있구만~~!!!
      • 리리루루
        완료!!!
      • OneJae EE
        20.03.16 월 / 37세 비전공자 / 완료

        -미디어 쿼리 주의-
        @media (min-width: 500px;)
        : px뒤에 세미콜론(;) 쓰면 작동안함.
      • 강명규
        완료
      • 송우영
        완료!!
      • 완료! 감사합니다 :)
      • Horang
        흐흐
      • 짱아찌
        완료
      • max-width:800px : 최대 폭 800px까지 적용
        min-width:800px : 최소 폭 800px부터 적용
      • 코딩하쟈
        완료~
      • daniellee12346
        완.료 @_@
      • eddylee123456
        완료
      • 완료
      • 규몽
        완료
      • 감사합니다. 완료
      • 뉴빈
        display:block; 기억할게요!
      • 정말 감사합니다.!!
      • King of kings
        ㅎㅎ오늘도 감사드려요 ㅎㅎ
      • gossie@naver.com
        완료하였습니다. 감사합니다.
      • 장 폴
        완료
      • Ram Lee
        재밌어요!
      • thsths
        완료
      • NarrPro
        @media 좋은 내용 고맙습니다
      • dofvmrhwk
        w좋아요! 완료
      • 스티븐잡숴
        완료
      • ㅇㅇ
        너무재밋당 ㅠㅠ감사해요
      • 융융
        좋은 강의 항상 감사드립니다!
      • 메메
        @media(max-width:800px){
        #grid{
        display:block;
        }
        }

        max-width:800px
        : 스크린의 폭이 800px 이하일 때(최대 폭 800px까지)↔min
      버전 관리
      egoing
      현재 버전
      선택 버전
      graphittie 자세히 보기