라벨이 HTML5인 게시물 표시

블로그 편집 시 자주 사용하는 html 태그 모음

출력 문자 HTML 코드 < &lt; > &gt; (Tab) <span style="white-space: pre;"> </span>

[HTML] HTML5 문서의 기본 구조

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>타이틀</title> </head> <body> <header></header> <section> <article></article> </section> <footer></footer> </body> </html>

[HTML] HTML5 태그

https://developer.mozilla.org/ko/docs/Web/HTML/Element

[HTML] HTML5 태그를 지원하지 않는 브라우저 처리

https://github.com/aFarkas/html5shiv 위 링크에서 js 파일을 다운받아서 <script src="./html5shiv.js"></script> 와 같이 링크하여 사용 위 방법이 불가능할 경우 아래와 같이 임시로 사용 header, hgroup, section, nav, article, footer{ display:block; } 또는 자바스크립트를 사용. 다음 스크립트를 <head>와 </head> 태그 사이에 아래 코드 삽입. <script> document.createElement('article'); document.createElement('section'); document.createElement('aside'); document.createElement('hgroup'); document.createElement('nav'); document.createElement('header'); document.createElement('footer'); </script>

[HTML] HTML5 지원하는지 확인

Modernizr는 인터넷 익스플로러에서 시맨틱 태그를 사용할 수 있게 해주는 방법이 아니라, 사용하려고 하는 HTML 태그나 CSS 속성을 현재 브라우저에서 지원하는지 확인하고, 지원하지 않을 경우 또 다른 해결 방법을 제시할 수 있다. 예를 들어, HTML5의 새로운 태그인 <video> 태그를 지원하는지 다음과 같이 확인할 수 있다. Modernizr는  https://modernizr.com  에서 최신 버전의 라이브러리를 다운로드할 수 있고, 다운로드한 파일은 다음과 같이 페이지에 링크하면 바로 사용할 수 있다. <head>     <script src="./modernizr.min.js"></script> </head>

[HTML] 표 관련 태그

<table> - 표 만들기 <th> - 제목이 들어갈 셀을 추가합니다. <tr> - 행 하나를 추가합니다. <td> - 셀 하나를 추가합니다. <col> - 여러 줄에 걸쳐 있는 열 하나를 지정합니다. <colgroup> - 여러 개의 col 요소를 하나의 그룹으로 묶습니다. <thead> - 여러 열을 하나의 그룹으로 묶어 표의 헤더로 지정합니다. <tfoot> - 여러 열을 묶어 표의 푸터로 지정합니다. // <tfoot> 태그는 <thead> 태그와 <tbody> 태그 사이에 위치해야 한다. <tbody> - 여러 열을 묶어 표의 본문으로 지정합니다. <th colspan="합칠 열의 개수"> 내용 </th> <td colspan="합칠 열의 개수"> 내용 </td> <th rowspan="합칠 행의 개수"> 내용 </th> <td rowspan="합칠 행의 개수"> 내용 </td> <caption> - 표에 제목 붙이기

[Eclipse] HTML5 포맷 Templates에 추가

이클립스에서 아래 메뉴 선택 "Window - Preferences" "Web - JSP Files - Editor - Templates" 아래 코드 추가 <%@ page language="java" contentType="text/html; charset=${encoding}" pageEncoding="${encoding}"%> <!DOCTYPE html> <html lang="ko-KR"> <head> <meta charset="${encoding}"> <meta name="viewport" content="width=device-width,initail-scale=1.0"/> <title>타이틀${cursor}</title> </head> <body> <header> </header> <section> <article> </article> </section> <footer> </footer> </body> </html>