전체 글
-
[HTML] HTML 5.2 변화, 특징 정리Dev/HTML 2017. 12. 17. 14:11
W3C에서 HTML 5.2 권고안을 공개하였다!! 1. 변화 HTML 5.1 이후의 새로 변화된 사항을 정리합니다. 세부적인 변경사항들은 W3C 깃 레포지토리의 커밋로그를 참고하라고 하네요 2. 새로운 특징들 요소 [ECMA-262] 자바 스크립트 모듈과의 통합 Referrer 정책 [REFERRERPOLICY] referrer는 현재페이지에서 이동해오기 바로 전 페이지의 주소를 말합니다. 예를 들어 A 페이지에서 링크를 타고 B페이지로 이동했다면, 여기서 Referrer는 A페이지의 주소가 되는 것 입니다. 브라우저에서 http 요청을 하면 대부분 리퍼러 정보가 같이 넘어갑니다. 그런데 간혹가다 이 리퍼러를 숨겨야 할 상황이 오게된다면 안에서 처리를 해주면 됩니다. 값으로는 no-referrer, un..
-
[CSS] - CSS Reset StylesheetDev/CSS 2017. 11. 23. 22:02
css Reset 에 대해 알아봅시당 CSS Reset 을 사용하는 이유 각 브라우저 마다 그 브라우저가 갖고있는 기본적인 style이 있습니다. 이 때문에 우리가 의도한 대로 표시되지 않을때가 종종 있죠. 그래서 아래에 기본적인 CSS들을 reset (재설정) 해주는 몇가지의 StyleSheet 들이 있습니다. 1. HTML5 Doctor CSS Reset - Eric Meyer 의 Reset.css 에서 부분 수정하여 나왔다는 html5 Doctor Reset css Stylesheet 입니다.http://html5doctor.com/html-5-reset-stylesheet/ 2. Meyerweb Reset.css - Eric Meyer 이 고안한 Reset CSS 입니다. 이 StyleSheet ..
-
[HTML] - Quirks mode (쿼크 모드) , Standard mode(표준 모드)Dev/HTML 2017. 11. 22. 00:00
Quirks mode , Standard mode 웹 페이지는 HTML 과 CSS로 구성된다. 하지만 오래된 웹페이지들은 매우 오래되어서 웹 표준 (W3C) 에 부합하지 않다. 그러다 보니 현재에 와서 렌더링 하는데 의도한대로 출력되지 않는 등의 문제가 생겼다. 그래서 이를 해결하기 위해 렌더링 모드를 갖게 되었다. 웹 브라우저에는 여러가지 렌더링 모드가 있다. Standard mode : W3C 표준에 따라 렌더링Quirks mode : 오래된 브라우저의 행동 모방하여 렌더링Almost Standard mode , Strict mode : Standard mode 와 table cell 에서 Quirks mode로 실행한다는 점 빼고 똑같음예를 들어) 사파리, 오페라, Gecko 기반의 모든 브라우저 ..
-
[HTML] - <! DOCTYPE> 에 대해서Dev/HTML 2017. 11. 21. 15:55
DOCTYPE 이란? 먼저, HTML 에는 아래와 같은 많은 버전들이 있습니다. HTML 5 XHTML 1.1 XHTML 1.0 Frameset XHTML 1.0 Transitional XHTML 1.0 Strict HTML 4.01 Frameset HTML 4.01 Transitional HTML 4.01 Strict 이렇게 HTML 의 버전들은 버전별로 지원하는 태그들이 조금씩 다르다고 합니다. 그래서 이를 어떤 버전으로 작성되었는지 미리 선언하여 웹 브라우저가 HTML 문서를 제대로 표현할 수 있게 도와주는 역할을 합니다. 또한 태그는 html 태그가 아닙니다. 단지 html 버전에 대한 웹 브라우저 지시어 입니다. 그래서 DOCTYPE 은 아래와 같이 html 문서 제일 위에 정의해 줍니다. 12..
-
[CSS] - BEM (Block Element Modifier) 방법론 [1]Dev/CSS 2017. 11. 21. 13:49
GDG DevFest Seoul 2017 에서 백성훈님의 CSS 와 BEM 세션을 듣고 난 후, 현재 하고 있는 프로젝트에도 BEM 을 적용하면 좋을 것 같아서 개인적으로 정리하게 되었습니다 BEM (Block Element Modifier) ?? BEM 은 Yandex 라는 회사에서 개발한 방법론으로, 사내에서 프로젝트를 진행하다가 Naming Convention과 File Structure 문제를 겪게되어 방법론을 개발했다고 합니다. 먼저 CSS 방법론을 사용하는 이유로는 1. 쉬운 유지보수 가능 2. 재사용 가능 3. 쉽게 확장 가능 이라는 공통의 목적을 가지고 있다고 합니다.https://medium.com/witinweb/css-%EB%B0%A9%EB%B2%95%EB%A1%A0-1-bem-blo..
-
[CSS] - Cascade RulesDev/CSS 2017. 11. 20. 22:24
Cascade Rules 에 대해서 Cascade Rules란? cascade 란 계단 형식의 폭포수를 의미합니다. 그리하여 css 에서도 단계에 따라 css 우선순위가 달라집니다. 아래는 Cascade Rules 에 대한 참고 자료 입니다. Cascade Rules 그러면 각 단계가 무엇을 의미하는지 알아보도록 하겠습니다. 1. inheritanceinheritance 는 상속을 의미합니다. 부모 요소에 적용을 해주면 , 자식 요소에도 같이 적용이 되는 경우가 있습니다. 대표적인 속성으로는 color 속성이 있습니다. 1234567891011helloworld p{color : red;} cs 이와 같이 p 태그의 color : red 속성은 em 태그 안의 'world' 에도 적용이 됩니다. (물론 ..