WEB2 - CSS

그리드

그리드의 기본 사용법

강의

caniuse 홈페이지

 

소스코드

변경사항

 

 

 

그리드 써먹기

강의

 

 

소스코드

변경사항

Grid 기능의 호환성

https://caniuse.com/#feat=css-grid 

댓글

댓글 본문
작성자
비밀번호
  1. Gwanghyeon Harry Gim
    첫 번째 영상에서는 태그로 <div> <div>를 적용하셨는데
    그리드를 두 번째 실습 영상에서 적용할 때에는 태그에 <ol>, <div>가 나오는 부분이 잘 이해되지 않습니다.

    태그가 무엇이든 상관없이 그리드를 적용하면 <태그 1> <태그 2>로 읽어 그리드가 동작하는 건지 궁금합니다.

    하나 더, CSS 본문에 <p>태그가 적용돼 있는데 p 태그를 없애도 똑같은 화면이 나오는지, 또 p태그 대신 div 태그를 넣어도 똑같은 화면이 나오는지도 궁금합니다. 결국 p와 div의 차이에 대한 질문이라고 생각하는데, 전에 일러주신 것 같지만 한 번 더 알려주시면 감사하겠습니다.
  2. BY Chin
    감사합니다
  3. PassionOfStudy
    18-01-14 1일차 - 7번째 강의

    수강완료!


    Grid라는 CSS부분이 정말 편리하네요 ^_^
    CSS의 디자인이라는 부분이 막막하고 복잡하다고 생각했는데,
    강의를 들으면서 심플하고 재미있어졌어요~ 감사합니다.
  4. goosen
    많이 배우고가요 항상 감사히 보고있습니다^^
  5. egoing
    브라우저가 아직 지원하지 않는 경우 작동하지 않아요~
    대화보기
    • 오상민
      이상하네요 크롬이외에 엣지나 IE11에서 작동을 안하네요 제가 잘못 사용한걸까요
    • Fiat
      고맙습니다 ^^
    • 부건혁
      사파리에서는 박스모델을 조정하는 기능이 없나요?
    • 설명 정말 잘해주셔서 귀에 쏙쏙 들어옵니다! 좋은 강의 감사합니다ㅎㅎ
    • keepgoing
      감사합니다
    • 판도라
      그리드에 대해서 명확이 알게되었습니다.
      감사합니다.
    • 그리드 대신에 float란 기능이 있어요. 생활코딩-클라인언트-css수업중에 float란 수업에 설명 되어 있네요.

      #grid ol이나 ol태그에 id값을 주나 결국 grid란 아이디 밑에 있는 ol태그만을 가리키기 때문에
      별차이 없지 않을까요?
      대화보기
      • 더블클릭 후 방향키 위아래로 조정할 수 있어요.
        대화보기
        • 노재학
          그리드의 호환성이 그리 높지 않은편인것같은데요 ( IE 11 버전 이하는 지원이 안되는것 같습니다)
          차선책으로 어떤 css 속성이 있을까요?

          그리고 ol 태그가 본문에도 나올 수 있으니 #grid ol 로 선택하셨는데 그렇게 하더라도
          #grid가 본문까지 묶어버렸기 때문에 ol 태그만 id 값을 다시 줘서 포함하는게 좋을까요?
        • ____hek
          혹시 크롬에서 검사에 들어가보면 padding같은 값을 실시간으로 값이 바뀌는 것을 보고싶을 때,
          값을 더블클릭을 하면 된다 하셨는데, 안되네요 ㅜ 다른 이유가 있나요?
        • GoldPenguin
          차근차근하게 설명해주셔서 이해가 잘되네요!! 감사합니다.
        버전 관리
        egoing
        현재 버전
        선택 버전
        graphittie 자세히 보기