목록Front-End/HTML (12)
drexqq
이미지 타입 선택 프로젝트 종류에 따른 이미지 타입 표 종류 PC Mobile Web Mobile App GIF 기본 사용 가능 X JPG 컬러수 많거나 운영성 이미지일 때 운영성 이미지일 때 X PNG-8 X 기본 반투명효과 없고 컬러가 적을 때 PNG-24 반투명효과가 있을 때에만 사용 컬러 수 많거나 반투명효과가 있을 때 기본 이미지 스프라이트 O O X
벤더 프리픽스(접두사) 주요 웹 브라우저 공급자가 새로운 실험적인 기능을 제공할 때 이전 버전의 웹 브라우저에 그 사실을 알려주기 위해 사용하는 접두사(prefix)를 의미합니다. 웹(Web) 벤더 프리픽스(Vendor prefix) Explorer -ms- Chrome -webkit- Firefox -moz- Safari -webkit- Opera -o-
조건부 주석은 IE10 미만에서만 작동하는 조건문으로, 이를 이용하여 IE 브라우저별로 어떤 기능이나 파일, 디자인 등을 삽입하는 용도로 자주 사용된다. ! : 아니다(not) - 예) [if !ie] ie가 아니라면 lt : 작다(less than) - 예) [if lt ie 9] ie9 보다 작다면 lte : 작거나 같다(less than equal) - 예) [if lte ie 8] ie8 보다 작거나 같다면 gt : 크다(greater than) - 예) [if gt ie 6] ie6 보다 크다면 gte : 크거나 같다(greater than equal) - 예) [if gte ie 7] ie7 보다 크거나 같다 () : 우선처리 & : 그리고(and) - 예) [if (gte ie 7)&(lt ..
HTML5 shiv 새로운 HTML5 섹션이 요소를 이전 버전의 IE6~9, Safari 4.x(iPhone 3.x)와 Firefox 3.x에서도 작동하도록 해주는 라이브러리이다. html5 shiv 사용법 다운로드한 파일의 dist 폴더에서 사용할 파일을 선택한 후 부분에 아래와 같이 적용한다. 이 코드를 사용한 경우 CSS에서 해당 블록 요소들을 display:block 해주어야 한다. article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;} html5 shiv 알려진 문제와 제한사항 ShivMethods 옵션(document.createElement)과..
파비콘 인터넷 웹 브라우저의 주소창에 표시되는 웹사이트나 웹페이지를 대표하는 아이콘이다. ICO 파비콘은 multiple sizes를 지원하기에 하나의 ICO 파일에 여러 사이즈의 아이콘을 넣어 두고 이를 활용할 수 있지만 PNG 파비콘은 이것이 불가능하다. 그런 이유로 각각의 필요한 사이즈를 아래와 같이 모두 선언해야 한다. 파비콘 PNG 파일 크기에 따른 용도 크기 파일명 용도 32x32 favicon-32.png 일부 오래된 하지만 너무 오래된 Chrome은 ICO를 제대로 처리하지 못함. 57x57 favicon-57.png 표준 iOS 홈스크린(iPad Touch, iPhone 3G의 1세대) 72x72 favicon-72.png iPad 홈스크린 아이콘 96x96 favicon-96.png 구..
태그(Tag) 태그는 정보를 정의하는 방식을 의미합니다. 태그는 열린태그와 닫는태그가 있습니다. 닫는 태그에는 "/" 있어야 합니다. 닫는 태그가 필요 없는 것도 있습니다.(br, hr, img, imput, meta) HTML5에서는 "/"가 생략이 가능합니다.
DTD(Document Type Declaration) 선언 웹 페이지를 제작하기 위해서는 웹 문서 형식 유형을 설정하여야 합니다 독타입을 설정하지 않거나 잘못 설정하면 브라우저에 따라 화면이 다르게 나오거나 렌더링이 달라지기 때문에 독타입을 설정해야 합니다.
특수문자 HTML에 본문에 바로 쓸 수 없는 특수한 문자입니다. 엔티티코드 사이트 바로가기 문자이스케이핑 > & & 공백 큰 따옴표 " &quop; 저작권 표시 © © 등록 상표 ™ ™ 등록 상표 ® ® 센트 ¢ ¢ ♥ ♥ · · – – — — 큰 따옴표 “ “ 큰 따옴표 ” ”
웹 문서에 대한 여러 가지 정보를 제공합니다. 메타 데이터설명 charset 웹 페이지 언어 설정 author 웹 페이지 만든 사람 description 웹 페이지에 대한 설명 keywords 웹 페이지에 대한 키워드 application name 웹 페이지에 관련된 웹 응용 프로그램의 이름 generator 웹 페이지를 만든 소프트웨어의 이름
하이퍼 링크를 정의합니다. href : 링크를 이동하는 경로를 설정합니다 target : 브라우저 타겟을 설정합니다. target="_blank" : 클릭시 새로운 브라우저 창으로 설정합니다. target="_parent" : 현재 브라우저의 부모 브라우저 창으로 설정합니다. 부모가 없는 경우는 "_self"와 동일합니다. target="_self" : 현재와 동일한 브라우저 창으로 설정합니다. target="_top" 최상위 브라우저 창에서 설정합니다. 부모가 없는 경우는 "_self"와 동일합니다. 방문하지 않은 링크느 밑줄과 파란색으로 표시됩니다. 방문한 링크는 밑줄과 보라색으로 표시됩니다. 활성화된 링크는 밑줄과 빨간색으로 표시됩니다. 태그는 예외적으로 HTML5에서 블록요소를 포함 할 수 있습니다.