728x90 300x250 SMALL Front-end312 CSS Diner 답안 (3/3) Level 22 3번째부터 시작해서 2n번째 plate를 선택합니다. :nth-of-type(2n+3){ } span:nth-of-type(6n+2)은 두 번째 인스턴스에서 시작하여 스팬의 6번째 인스턴스를 모두 선택합니다. Level 23 중간접시에 있는 apple를 선택하세요 plate .small:only-of-type { } :only-of-type는 해당 유형의 유일한 요소를 선택합니다. p span:only-of-type은 p에서 유일한 스팬인 경우 p 내의 스팬을 선택합니다. Level 24 마지막 번째 apple과 orange를 선택하세요 2021. 6. 24. CSS Diner 답안 (2/3) Level 11 plate에 있는 모든것을 선택하세요 plate *{ } Level 12 plate 다음에 있는 모든 apple 선택하기 plate + apple{ } p + .intro 라고 하면 엘리먼트 바로 다음에 나오는 모든 class="intro" 를 선택합니다. Level 13 bento 옆에 있는 pickles을 선택하세요 bento ~ pickle { } A~B는 A다음에 오는 모든 B를 선택합니다. Level 14 plate 위에 직접 올려진 apple를 선택하세요 plate > apple { } A > B는 A 엘리먼트의 다이렉트 자식 엘리먼트중 모든 B 엘리먼트를 선택합니다. Level 15 제일 위에 있는 orange를 선택하세요 orange:first-child { } Level .. 2021. 6. 23. CSS Diner 게임 공략법 Select the plates (1/3) CSS 연습하기 좋은 CSS Diner 게임입니다. https://flukeout.github.io/ CSS Diner A fun game to help you learn and practice CSS selectors. flukeout.github.io 들어가면 Select the plates라고 하면서 그릇 두개가 춤추고 있는게 보이는데 우리가 왼쪽에 css 를 작성해서 plate 그릇을 선택하는 css를 쓰면 됩니다. 단곈는 1에서 32까지 있습니다. Level 1 plate 선택하기 html css plate { } Level 2 bento 선택하기 bento { } Level 3 fancy plate 선택하기 #fancy { } Level 4 plate 안에 있는 apple 선택하기 plate .. 2021. 6. 22. Height 100% 적용 안될 때 Height 100% 적용안되는 이유 1. height 100% 설정하려면 부모요소의 height값이 명확하게 설정 되 있어야 합니다. 따라서 부모요소의 height값이 제대로 정의 되어있는지 확인합니다. 2. min-height와 height값이 동시 적용되어있는 경우에는 최소 height 값을 기준으로 height:100%가 적용됩니다. 3. 그래도 안될경우 사용할 방법입니다. 이도저도 안될경우 해결한 트릭중 하나 입니다. 4. height와 width속성에 따로 값을 설정하지 않았다면 default 값인 auto로 지정됩니다. auto값은 브라우저가 그 크기를 계산해 줍니다. 5. display:block;로 설정 되있는 경우 width:auto;는 width:100%로 설정 됩니다. height:.. 2021. 6. 16. 이전 1 ··· 61 62 63 64 65 66 67 ··· 78 다음 728x90 반응형 LIST
