데브마우스

Font Awesome이란 무엇인가요? Font Awesome is the Internet's icon library and toolkit, used by millions of designers, developers, and content creators. Font Awesome은 인터넷의 아이콘 라이브러리와 툴킷이며, 수백만명의 디자이너, 개발자 그리고 컨텐츠 크리에이터들에게 사용되고 있습니다. 출처: Font Awesome 공식 홈페이지 Font Awesome 첫페이지의 소개처럼 Font Awesome을 사용하여 웹 사이트를 더 예쁘게 만들 수 있습니다. 무료 사용자도 사용할 수 있는 무료 아이콘들이 있습니다. 회원가입을 하셔야 사용이 가능합니다. 아래 사이트가 공식 홈페이지입니다. https://f..

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와 JS를 통하여 미리 개발되어 있습니다. 덕분에 개발자가 직접 CSS를 작성하지 않아도 미리 자바스크립트와 CSS를 활용하여 작성된 프레임워크를 제공하며 더 빠르게 개발할 수 있습니다. 부트스트랩은 상업적 이용이 가능합니다. 부트스트랩은 모바일기기나 컴퓨터처럼 해상도가 큰 다양한 환경에서 사용할 수 있도록 반응형 웹에 특화되어 있습니다. 부트스트랩을 사용하는 방법으로, CDN을 통해 HTML 파일에 부트스트랩 링크를 넣어서 사용할 수도 있으며 부트스트랩 파일을 다운로드해서 서버와 함께 제공할수도 있습니다. 부트스트랩 사용시 개발자들끼리 같은 버전을 사용해야 하는 이유는 뭔가요? 다른 사람과 협업하거나 교재를 보고 공부중이시라면 같은 ..

MDN은 무엇인가요? MDN은 모질라(Mozilla) 재단에서 운영하는 Mozilla Developer Network의 약자로 프론트 엔드 프로그래밍에 대한 많은 정보가 있습니다. HTML, CSS, JavaScript의 문법 하나에도 다양한 예제가 있으며 코드를 편집해서 바로 확인할 수 있습니다. MDN은 왜 사용하나요? 프로그래밍 문법에 대한 사용 예제를 확인할 수 있습니다. 브라우저별 호환성을 표로 볼 수 있습니다. (일부 미번역 문서가 있지만) 한글 지원으로 쉽게 확인할 수 있습니다. 등 다양한 장점이 있습니다. MDN은 어떻게 사용하나요? https://developer.mozilla.org/ko/ 에서 확인할 수 있습니다. 메인페이지는 영어로 나오지만 검색시 한글 문서가 나옵니다.