html, css
-
<section> vs <article>html, css/html 2017. 10. 11. 10:53
www.w3.org에서 section 태그와 article 태그의 정의를 다음과 같이 하고 있습니다. article 요소는 문서, 페이지, 응용 프로그램 또는 사이트에서 완전하거나 완전한 구성을 나타냅니다. 이것은 잡지, 신문, 기술, 학술 기사, 에세이 또는 다른 소셜 미디어 게시물, 블로그 또는 기타 소셜 미디어 게시물일 수 있다. 일반적인 규칙은 문서의 내용이 문서의 윤곽에 명시적으로 나열되는 경우에만 문서 요소가 적합하다는 것이다. 각 문서는 일반적으로 품목 요소의 하위 항목으로서 제목(h1 - h6 요소)을 포함하여 식별해야 한다. 복수의 기술은 그 기사의 의미를 사용자에게 전달할 수 있다. 이 정보는 사용자에게 콘텐츠 유형에 대한 힌트를 제공할 수 있습니다. 예를 들어, 요소의 역할과 일치하는..
-
html의 역사 및 html5 란?html, css/html 2017. 9. 24. 14:11
HTML5의 역사 TimBerners-Lee는 1989년에 "WorldWideWeb"를 발명했고, 1990년대에 인터넷이 꺼졌다. 1991년부터 1998년까지, HTML은 버전 1에서 버전 4로 발전했다. 2000년에는 월드 와이드 웹 컨소시엄(W2C)이 eTTML1.0을 추천했다. XHTML 구문은 엄격하며, 개발자들은 유효하고"잘 짜여진 "코드를 쓰도록 강요당했다. 2004년에 WHATWORD(WebHypertextApplicationWorkingGroup)는 느린 W/C개발을 위해 HTML의 개발을 중단하고 HTML의 개발을 위해 HTML의 개발을 중단한 상태로 형성되었다. WHATWORD는 HTML을 사용하여 이전 버전의 HTML과 호환되는 반면, 웹을 사용하는 방법과 일치하는 HTML을 개발하고..
-
반응형 웹 레이아웃 주의사항 _2html, css/반응형 웹 2017. 8. 19. 16:44
반응형 웹 레이아웃 주의사항 2번째 포스트입니다. 2. table 태그에서 rowspan, colspan을 css로 컨트롤 할 수 없습니다. 다음 이미지와 같이 모바일 화면과 PC 화면에서의 테이블 표를 다르게 하고 싶은 경우가 있을 것입니다. 모바일 화면에서는 제목 열이 4칸 인데 PC에서는 제목열이 3칸이고 , 또 PC 에서는 내용1열B와 2열B 가 합쳐져 있습니다. 저렇게 표현을 하려면 다음과 같은 html 로 수정이 되어야 합니다. [모바일 html] [PC html] PC 화면의 html 을 확인 하게 되면 안에 있는 두번째 태그 colsapn="2"를 추가 해주었고, 갯수를 하나 지워 주었습니다.그리고 안에 있는 첫번째 안에 있는 두번째 에 rowspan="2" 를 추가 해주었고, 두번째 안에..
-
반응형 웹 레이아웃 주의사항 _1html, css/반응형 웹 2017. 8. 17. 22:40
반응형 웹 레이아웃을 구상하기 전에 다음과 같은 부분들을 알고 구상을 하면 반응형 프로젝트를 좀 더 시간을 단축 할 수 있고 좀 더 효율적인 화면이 탄생 될 것이라 생각합니다. 반응형 웹이란 쉽게 이야기하면 하나의 html 요소들을 css(media query)를 이용하여 PC, 모바일, 태블릿 화면에 알맞는 레이아웃을 표현 해 주는 것입니다. 여기서 더 간단히 요점만 말하자면 기본 하나의 뼈대로 PC일때, 모바일 일때, 태블릿 일때 옷 만 바뀌는 것입니다.(긴팔에서 반팔, 무지 t셔츠가 스프라이트 t셔츠로..이런느낌 입니다.) 뼈 들이 움직이지는 못하고 뼈를 감싸고 있는 옷만 바뀌는 것이기 때문에 레이아웃을 표현 하는데 어느 부분은 제한적인 부분들이 있습니다. 제가 정리하고 싶은 부분은 이런 제한적인 ..
-
Css 깊이있게_2 inherit(상속)에 대해서html, css/css 2017. 8. 12. 20:45
다른 분들이 포스팅을 안 한 것을 찾던 중에 상속에 대해서는 글 들이 많이 없는 것 같아서 이렇게 정리합니다. w3schools에서 font-size랑 margin을 검색하면 다음과 같이 나옵니다. font-size는 inherited가 yes 이고 margin은 inherited가 no 인데요, 이 차이에 대해서 설명 하겠습니다. 먼저 다음과 같이 코딩을 하고 crome 브라우저 요소 검사 화면을 확인 하면 다음과 같이 나오는데요. .parent_element DIV 에 font-size:24px을 주었는데요, 화면을 확인 해보니 .parent_element DIV 안에 있는 div, p, span 태그에 있는tex도 font-size 가 24px로 바뀐것을 확인 할 수 있습니다. 요소검사 창 우측에 ..
-
Css 깊이있게_1 Css 속성 Default value 정리html, css/css 2017. 7. 22. 22:42
css 속성들이 엄청 많은데요..이 중 저의 경험으로 자주 사용했던 것들만 정리 했습니다. 자주 사용 하는 것들은 외우는게 편하더라구요.필요할때 마다 w3schools 에 검색하는것도 귀찮고 ㅎㅎㅎㅎ(none, 0, normal 이 은근 햇갈립니다..--;;) 정리하면서, 제가 사용은 안했지만 새로 알게 된 것도 함께 정리했습니다. Property Default value display ?https://www.w3schools.com/cssref/pr_class_display.asp물음표라고 나와 있네요;; overflow visible position static float none z-index auto width, height auto max-width, max-height none margin, ..