본문 바로가기
728x90
300x250
SMALL

Front-end/CSS65

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.
css3추가 글꼴속성 css3추가 글꼴 속성은 모든 브라우저에서 지원되는게 아니기 때문에 http://www.w3.org/TR/css-fonts-3/지원 브라우저에 대한 확인이 필요하다 font-feature-settings : 오픈 타입 글꼴의 세부 설정을 조절font-language-override : lang속성을 지정했던 언어를 덮어쓸 단른 언어를 지정함font-kerning : !같은 글자를 위해 글꼴에서 각 글자 사이의 간격 조절을 지정font-variant-alternates : 기본 글꼴 외에 다른 형태로 표시하는 기능을 지정font-variant-ligatures : 글자를 더 보기 좋게 만드는 기능을 지정font-variant-position : 글꼴에 포함된 위 첨자, 아래 첨자를 사용합니다. 글꼴에 이런.. 2019. 2. 2.
css3에서 추가된 글꼴 속성 모든 브라우저에서 지원되는것은 아니다지원 브라우저에대한 정보확인 아래의 링크에서 확인 가능하다. http://www.w3.org/TR/css-fonts-3/ font-feature-settings 오픈 타입 글꼴의 세부 설정을 조절font-language-override lang속성을 지정했던 언어를 덮어쓸 단른 언어를 지정함font-kerning !같은 글자를 위해 글꼴에서 각 글자 사이의 간격 조절을 지정font-variant-alternates 기본 글꼴 외에 다른 형태로 표시하는 기능을 지정font-variant-ligatures 글자를 더 보기 좋게 만드는 기능을 지정font-variant-position 글꼴에 포함된 위 첨자, 아래 첨자를 사용합니다. 글꼴에 이런 첨자가 없다면 브라우저에서 .. 2018. 12. 21.
728x90
반응형
LIST