신기한 웹 세상

Tag

HTML

IE10, IE11 셀럭트박스 텍스트상자 커지는 현상

문제 IE10, IE11에서 셀럭트박스 선택을 하면 아무이상이 없는데 input 상자에 포커스 있는 상태에서 셀럭트박스를 다시 선택하면 텍스트상자 넓이가 커지는 현상이 있습니다. 이유는 placeholder로 인해서 일어나는 현상입니다.(IE10, IE11에서만 오류가 일어납니다.) 오류는 아래와 같습니다. 선택1선택2선택3 오류 체크 하셨습니까? 혹시 확인을 못하신 분들을… Continue Reading →

HTML <head> 태그를 알아보자

HTML을 사용하면서 <meta>태그를 사용하긴 하는데 대충 이해(자주 사용하는 요소만)만 하거나 아니면 전에 작성한 것을 CTRL+C, CTRL+V하기만 했었다. 그치만 근래 Open Graph도 많이 사용 되면서 궁금증이 생겨났고, 좀 더 깊이 그리고 자세히 알고 싶어졌다. 혹시 나와 같은 사람들이 분명히 있을 듯하여… Continue Reading →

footer 하단영역에 고정시키기

컨텐츠 영역 상관없이 footer가 하단에 붙게하려면 position:fixed를 하는 방법이 있지만 이건 하단고정이긴 한데.. 위에 뜬 형태이기도 하면서 컨텐츠가 없든 많던간에 원하는 모습이 보여지지 않는다. 그래서 방법이 아래와 같다. HTML 마크업: <div id=”wrap”> <div id=”header”>Header</div> <div id=”body”> <div id=”container”>Contents</div> </div> <div… Continue Reading →

서브라임 플로그인 HTML Entity Snippets

Packages: HTMLEntity Snippets Github: HTMLEntity-Snippets 정리해야할 것들이 태산이다.

HTML <strong> 과 <b> , <em>과 <i> 차이점

<strong>과 <b>를 사용할 때 웹에서 보여지는 것은 둘다 차이가 없다. 좀 더 깊게 들어갈 경우 웹표준 및 웹 접근성을 따지게 되면.. W3에서 <strong> 과 <em>에 대해서 설명하기를.. – 내용을 강조하기 위해서 <strong> 및 <em>을 사용한다. – 일반적으로 사용자에게 보여줄 때… Continue Reading →

HTML Character Entity Code Reference Table

HTML Character Entity Code Reference Table 보기   HTML Character Entity Code Reference Table Character Entity Description Displayed Character Entity Code Name Character Entity Code Name Displayed Character Entity Code Number Character Entity Code Number quotation mark, APL quote “… Continue Reading →

HTML5 내용의 종류

1. 콘텐츠 모델(Content Models) 기존 HTML 기반의 마크업에서는 일반적으로 인라인 요소(Inline Element)와 블록 요소(Block Level Element)로 구분하는 정도의 개념만 존재하였지만, HTML5에서는 좀 더 명확한 정보 구조 설계 및 구성을 위해 카테고리를 정의하여 각 요소별로 비슷한 성격을 가지고 있는 것 끼리… Continue Reading →

IE에서 호환성보기 모드 meta태그를 이용

X-UA-Compatible을 통해서 브라우저의 호환성 모드를 조정할 수 있습니다 IE=edge : 설치된 IE중 가장 최신 버전으로 렌더링에 사용 chrome=1 : 크롬이 설치되어있다면 IE에서도 크롬 렌더링을 사용. 그러나, chorme=1는 2014년 1월에 지원과 업데이트를 중단한다고 발표 했습니다. 참고 위키 문서 하지만, HTML5 DTD… Continue Reading →

IE에서 호환성보기 모드

X-UA-Compatible을 통해서 브라우저의 호환성 모드를 조정할 수 있습니다 IE=edge : 설치된 IE중 가장 최신 버전으로 렌더링에 사용 chrome=1 : 크롬이 설치되어있다면 IE에서도 크롬 렌더링을 사용. 그러나, chorme=1는 2014년 1월에 지원과 업데이트를 중단한다고 발표 했습니다. 참고 위키 문서 하지만, < !doctype... Continue Reading →

HTML 태그 약자 설명

HTML 태그 약자 설명 a href = Anchor(배에 달려있는 닻) Hypertext REFernce img = IMaGe(이미지) head = 머릿글 html = HyperText MarkupLanguage b = Bold(굵은글씨) i = Italic(이탤릭체.기울어진) u = Underline(밑줄) target = 표적 title = 표제 id = IDentification(신원확인)… Continue Reading →

웹접근성 데이터 테이블

웹접근성 데이터 테이블 지침서 표의 제목셀과 내용셀을 올바르게 짝짓기 표의 제목셀과 내용 셀은 짝짓기가 바르게 되어야 표를 표시할 수 없는 상황에서 표를 펼치거나 화면 낭독 프로그램 등에서 표를 순서대로 읽어줄 때에도 표가 제공하고자 하는 정보를 이해할 수 있음. 짝짓는 방법… Continue Reading →

HTML5 시맨틱(Semantic) 마크업

  시맨틱 마크업(Semantic Markup) : 컴퓨터가 웹 정보자원의 의미를 이해할 수 있도록 문서의 논리적인 구조를 묘사하는 것. 시맨틱 마크업을 통해 얻을 수 있는 장점 – 접근성이 좋아짐 – SEO(Search Engine Optimization) – 수정이 용이해짐 – 코드 가독성이 좋아짐 – 코드와… Continue Reading →

IE6에서 롤오버시에 이미지 깜빡거리는 문제

IE6 마우스 롤오버시 혹은 클릭이벤트로 이미지를 바꾼다거나 백그라운드 포지션이 변경이 될때 깜빡거리는 현상이 일어나는데.. CSS 나 javascript로 방지할 수 있다.  CSS <style type=”text/css”> html { filter: expression(document.execCommand(“BackgroundImageCache”, false, true));} </style>     Javascript *추천 <script type=”text/javascript”> try {document.execCommand(“BackgroundImageCache”,false,true);}catch(e){} </script>    

DTD(Document Type Definition) 문서 구조

1) HTML 2.0 표준 문서 형식 < !DOCTYPE html PUBLIC "=//IETF//DTD HTML 2.0//EN"> 2) HTML 3.2 표준 문서 형식 < !DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> 3) HTML 4.01 표준 문서 형식 < !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"... Continue Reading →


© 2017 신기한 웹 세상

Up ↑