본문 바로가기

HTML, CSS3

[CSS] 콧수염 만들기 (box-shadow, transform, ...) by. Coding Tech 해당 페이지는 Coding Tech의 CSS로 기술 영상을 보고 정리한 글입니다. See the Pen [CSS] mustache icon by hyuna lee (@leehyun-a) on CodePen. 사용된 CSScurrentColor currentColor는 element의 현재 text color를 의미하며, color 값을 사용하는 모든 선언에 사용할 수 있습니다. .mustache { width: 180px; height: 180px; color: black; background-color: currentColor; } box-shadow element에 한개 이상의 그림자를 추가하는 속성이다. box-shadow: none|h-offset v-offset blur spread color .. 2018. 12. 10.
[CSS] 스타일 'unset' button, input 등 스타일을 적용하기 위해서 각 브라우저마다 기본으로 적용되어 있는 style을 초기화 시키고 새로운 style을 적용한다. button의 경우 아래와 같이 작업해 줘야 한다. button { border: none; background-color: #16a085; border-radius: 10px; padding: 5px 10px; } button:focus, button:active { outline: noen; } 이러한 기본 스타일을 한번에 초기화 시켜버리는 방법이 있다. button { all: unset; } 대박이다... 만약 모든 태그에 대해서 unset을 적용하고 싶다면 아래와 같이 작성하자. body > * { all: unset; } 이 이후에 추가적으로 자.. 2018. 12. 7.
[HTML] DOCTYPE DOCTYPE 이란 어떤 HTML 표준을 사용할 것인지 문서 상단에 적어주는 것이다. 위키백과에 따르면, "문서 형식 선언"(Document Type Declaration) 또는 DOCTYPE이란 어떤 SGML이나 XML 기반 문서 내에 그 문서가 특정 문서 형식 정의(DTD)를 따름을 지정하는 것이다. DOCTYPE에 들어가보면 HTML 문서 형식은 다양하며 많이 발전해왔다. 따라서 예전 같은 경우 태그의 종류가 20개 사이에서 140개 이상의 종류가 생겨났다. 따라서 자신이 사용되는 문서가 어떤 문서인지 "형식"을 정해주고, 그 형식에 맞추어 "태그"를 사용하는 것이다. 최근에는 HTML5에 접어들면서 을 사용하고 있다. 무슨 내용인지 모르겠다면 html 문서 작성시에 DOCTYPE을 필수적으로 작성.. 2018. 11. 28.