좌충우돌 웹퍼블리셔 일기

ie 랜더링 문제

크로스브라우징 2010. 5. 14. 11:59

온갖 비표준에 난무네...쓰지 말아야 될 스타일을 잔뜩 써놔서 억지로 돌아가게 만드려고 보니 아래 메타태그가 필요해졌다.
ie7에서 스크롤이 왜나오나 했더니.....결국은 overflow 버그였다. 일단 아래 메타태그로 해결하긴 했는데 문제가 없는걸까????

<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

지난해에 메타태그를 써서 크로스브라우징을 좀 더 편하게 작업하고자 했었는데 잘 안되서 던저버렸더랬다. 헌데 이번 프로젝트에서는 참으로 유용하게 쓰이고 있다. 일단 테스트 해 본 결과 ie7과 edge는 서로 호환이 잘 된다. 6버전은 아직 테스트를 해보지 못했다. 버전별 테스트를 해봐야 하는데...보안으로 막혀있어 일반 테스트용으로는 테스트도 안되고 컴퓨터가 반드시 한대 이상 필요한 상황. ie7의 경우는 호환성보기체크로 쉽게 체크해볼 수 있었을것을....무지가 몸을 고생시킨다.

만약 특정 페이지에서 메타태그가 먹지 않는다면 dtd 선언이 무시되고 있다고 의심해 볼 수 있다.
dtd 위에  주석이 있다면 dtd 는 무시된다.

'크로스브라우징' 카테고리의 다른 글

min-height (0)	2010.07.10
ie6 position 버그 (0)	2010.07.09
브라우저별 테이블 height 값으로 본 픽셀 테스트 (0)	2010.04.21
게시판 tr 오버시 색을 입히는 방법 (0)	2010.04.08
1px 공간 버그 (0)	2010.04.08

:

파비콘

HTML 2010. 5. 14. 10:28

브라우저 주소창의 URL 왼쪽에 16x16 픽셀의 조그마한 아이콘을 넣는 방법입니다. 이런 아이콘을 "파비콘(favicon; favorites icon)"이라고 합니다. 원래 MS가 IE 브라우저를 위해서 만든 것입니다. 그래서 웹 표준이 아니지만 파이어폭스에서도 잘 지원됩니다.

실은 몇 년 전부터 IE에서는 파비콘이 잘 보이지 않게 되었습니다. 이제는 오히려 파이어폭스에서 파비콘이 더 잘 보이더군요.

favicon.ico 파일 만들기

우선 favicon.ico 라는 파일명의 아이콘 파일을 만들어야 합니다.

마이크로안젤로 같은 아이콘 편집기를 사용하여 만들면 됩니다: ▶▶ 윈도우 아이콘/마우스 커서 편집 프로그램: Microangelo Toolset (마이크로안젤로)

되도록 16x16 픽셀의 소형 아이콘으로 저장해야 합니다.

그런 후 아이콘 파일을 서버에 올립니다. 지오시티(Geocities) 등의 서버에서는 .ico 확장자 파일을 거부하는데, 이때는 favicon.ico 를 favicon.zip 등으로 확장자를 변경하여 업로드한 후, 다시 이름을 favicon.ico 로 고쳐 주어야 합니다.

Favicon 추가 태그

웹페이지의 <head></head> 태그 사이에 다음의 코드를 삽입하면 됩니다.

위의 코드에서 www.example.com 이라고 된 부분을, 자신의 실제 주소로 바꾸어 주어야 합니다.

브라우저 주소창에 파비콘 (URL 아이콘) 넣기 예제

HTML 페이지의 최종적인 형태는 다음과 같습니다:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>페이지 제목</title>
<link rel="shortcut icon" type="image/x-icon" href="http://www.example.com/favicon.ico" />
</head>

<body>
... 여기서 부터 본문 시작 ...

헤드 태그 속의 맨 마지막에 넣으면 적당합니다. 별로 중요한 요소가 아닌 것은 되도록 아래쪽에 넣는 것이 좋습니다.

만약 파일명을 favicon.ico 로 할 수 없는 경우에는 다른 파일명을 지정해도 괜찮습니다.

그런데 favicon.ico 파일은 서버의 루트 디렉토리(최상위 디렉토리)에 있어야 합니다. 그렇지 않고 하위 디렉토리 속에 있으면 IE에서 인식을 못하더군요.

IE 6 브라우저에서 Favicon 이 보이지 않는 문제

파이어폭스에서는 Favicon 이 항상 잘 보입니다. 그렇지만 IE 에서는 좀 문제가 있습니다. 해당 사이트의 파비콘을 보기 위해서는, 우선 Ctrl+D키를 눌러 그 사이트에 대한 북마크를 만든 후, IE를 닫고 다시 실행하여 그 사이트를 재방문해야, 주소창에 파비콘이 보이는 문제가 있습니다. 그렇지만 이 방법도 확실하게 잘 되는 것은 아닙니다.

>>출처 : mwultong Blog

'HTML' 카테고리의 다른 글

비디오 (0)	2011.05.12
펌] 폼(Form) 디자인 잘했다는 소리를 듣기 위한 방법론 (0)	2011.03.09
HTML5 표준 기술과 서비스 생태계 변화 (0)	2011.01.24
아이프레임 투명하게 만드는 방법 (0)	2010.11.18
올바른 Table 사용 (0)	2010.04.01

:

Html에 플래시 넣기

CSS 2010. 5. 11. 10:26

플래시를 넣을 때에 예전에는 테두리가 생기는 것 때문에 스크립트를 사용하여 넣었었다. 하지만 이제는 object 를 사용하여서 넣으면 테두리가 생기지 않고 나온다.

이렇게 넣으면 자바스크립트를 사용하지 않고서도 플래시를 문서에 넣을 수 있다.

'CSS' 카테고리의 다른 글

select 안에 이미지 넣기 (0)	2010.10.18
div 정가운데 위치시키기 (0)	2010.08.04
폰트 사이즈 비교 (0)	2010.04.22
CSS속성 선언 순서 (0)	2010.04.22
display: block과 inline (2)	2010.04.15

: