데브마우스

CSS 선택자란 무엇인가요? CSS에서 원하는 스타일을 적용시키기 위해서, 요소를 선택해야합니다. CSS에서 요소를 선택하는 방법은 여러가지 방법이 있습니다. CSS를 잘다루는 사람 일수록 선택자를 잘 다뤄서 CSS의 코드의 길이를 짧게 할 수 있습니다. CSS3 선택자 종류 사용 방법 설명 전체 선택자 * {속성 선언;} 모든 태그에 스타일을 적용합니다. 타입 선택자 태그 {속성 선언;} 지정한 태그에 스타일을 적용합니다. 클래스 선택자 .클래스 이름 {속성 선언;} 지정한 클래스에 스타일을 적용합니다. 아이디 선택자 #아이디 {속성 선언;} 지정한 아이디에 스타일을 적용합니다. CSS3 복합 선택자-작성중 구분 조합 방법 설명 후손 선택자 선택자 A 선택자 B 선택자 B가 선택자 A에 반드시 포함되어..

CSS의 단위 현실 세계에서는 cm, m, inch 등 다양한 단위가 있습니다. 그리고 단위에는 이것을 기준으로 1cm라고 한다는 등 기준이 있습니다. 그렇다면 CSS에서는 어떤 단위가 있으며 어떻게 기준을 잡을까요? CSS에는 총 4가지 기준이 있습니다. px(픽셀) % em,rem vw,vh px(Pixel, 픽셀) 픽셀은 고정된 사이즈를 의미합니다. 반응형이 아니며 사용자가 웹 브라우저의 크기를 줄이거나 늘려도 크기를 그대로 유지합니다. This is parent div This is child div /* style.css */ .parent { height: 200px; width: 300px; border: 1px solid red; } .child{ height: 400px; width: 6..

상속이란 무엇인가요? 일상생활 속에서 상속이란 자식이 부모의 재산을 물려받는걸 뜻합니다. CSS에서는 부모 스타일이 자식 까지 영향을 미치는 것을 상속이라고 정의합니다. 상속되지 않는 속성도 inherit이라는 속성 값을 사용하여 강제로 부모로부터 자식에게 상속시킬 수 있습니다. 단, 자식을 제외한 후손(손자)에게는 적용이 되지 않으며, 모든 속성이 강제 상속되지는 않습니다. 상속의 주의점 .redbox {color:red}는 모든 후손에게 상속 시킬 수 있습니다. 하지만 display:flex는 자기 자신과 자식을 꾸미는 요소이기에 상속시킬 수 없는 속성입니다. 즉 모든 후손에게 까지 적용이 되어야 상속이라 할 수 있습니다.

CSS란 무엇인가요? CSS란 Cascading Style Sheets의 약자로써 웹 페이지를 꾸며주는 연쇄 스타일 시트입니다. 1996년 CSS버전1이 출시되었으며 글 작성 시점에서 CSS의 최신버전은 CSS3입니다. 왜 CSS를 사용하나요? 초기의 웹 페이지는 HTML만 있었습니다. 그러다보니 문서를 아름답게 꾸밀 수 없었습니다. 웹 문서를 더 아름답게 꾸미기 위해 CSS를 사용했습니다. 문서 작성을 HTML이 담당한다면 디자인은 CSS가 담당합니다. CSS 적용 방법 CSS는 HTML 파일 내부에 적용하거나 별개의 .CSS 파일을 만들어서 적용시킬 수 도 있습니다. 적용 방법 예시 파일 내부의 HTML 태그에 적용 CSS를 HTML 태그에 적용 파일 내부의 파일 외부의 별개의 파일로 적용 CSS 적..