웹이야기/웹/HTML (12)
  1. 2012.06.23[HTML] 메타 태그를 사용하여 사이트 검색 로봇 액세스 차단 방법
  2. 2012.05.08[JavaScript] 웹 브라우저의 즐겨찾기 추가 스크립트(1)
  3. 2012.03.13[CSS] 초기화(Reset) 코드
  4. 2011.11.17[HTML] Google 크롬을 활용한 HTML5 웹사이트 확인
  5. 2011.11.15[HTML] HTML5 설명 및 기본 마크업
  6. 2011.09.15인터넷 익스플로러(Internet Explorer)의 교차 사이트 스크립팅(XSS)(4)
  7. 2011.07.14파이어폭스(Mozilla Firefox) 주소 명령 체계
  8. 2010.12.20세리프(Serif)와 산세리프(Sans-Serif) 폰트 타입
  9. 2010.12.16[HTML] 문자 세트 및 기호 간접 표현식
  10. 2010.12.16meta 태그를 이용한 Internet Explorer 랜더링 설정
[HTML] 메타 태그를 사용하여 사이트 검색 로봇 액세스 차단 방법

메타 태그(Meta tag)를 사용하여 사이트 검색 로봇 액세스 차단 방법

페이지가 다른 사이트에 연결되어 있더라도 페이지의 콘텐츠가 Google 웹 색인에 열거되지 않도록 완전히 차단하려면 no index 메타 태그를 사용합니다. 그러면 Googlebot이 페이지를 가져오는 즉시 no index 메타 태그를 보게 되고 해당 페이지가 웹 색인에 표시되지 않습니다.

메타 태그(Meta tag) 코드

이 방법은 서버에 대한 루트 액세스 권한이 없을 때 페이지별로 사이트에 대한 액세스를 제어할 수 있어 유용합니다. 어떤 로봇도 사이트의 페이지에 대해 색인을 생성하지 못하게 하려면 페이지의 <head> 섹션에 다음 메타 태그를 추가합니다.

<meta name="robots" content="noindex">

Google 로봇을 제외한 다른 모든 로봇이 사이트의 페이지에 대해 색인을 생성하도록 허용하려면 다음 메타태그를 추가합니다.

<meta name="googlebot" content="noindex">

다른 페이지에 연결되어 있는 경우에도 페이지에 noindex 메타 태그가 있으면 Google은 검색결과에 해당 페이지를 표시하지 않습니다. 하지만 다른 검색엔진에서는 이 태그가 다르게 해석될 수도 있으며, 이 경우 해당 페이지에 대한 링크가 검색결과에 표시될 수 있습니다.

페이지를 크롤링해야 noindex 메타 태그가 있는지 알 수 있으므로 Googlebot이 크롤링하지 않은 경우 noindex 메타 태그를 확인하지 못해 올바르게 처리하지 못할 수도 있습니다. 페이지가 계속 검색결과에 표시된다면 태그를 추가한 이후 Google에서 사이트를 아직 크롤링하지 않았기 때문일 가능성이 큽니다. 또한 robots.txt 파일을 사용하여 해당 페이지를 차단할 경우에도 태그를 확인할 수 없습니다.

내용 출처/참고 자료 Google 웹마스터 도구: 도움말
0 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

[JavaScript] 웹 브라우저의 즐겨찾기 추가 스크립트

현재 페이지 즐겨찾기 추가 기능

즐겨찾기 추가 기능은 JavaScript로 구현하여 웹 브라우저의 즐겨찾기 추가 기능을 활용합니다.

Internet Explorer, Firefox, Opera에서만 지원하며, 그 외의 웹 브라우저는 알림메시지를 보여줍니다.

현재 페이지 즐겨찾기 추가 구현 JavaScript

JavaScript 코드 안내
  • • 아래의 링크를 클릭하면 기능을 시험해보실 수 있습니다.

JavaScript 코드 적용 방법 및 다운로드

JavaScript 코드 삽입 화면
  • 스킨 페이지(Skin.html)의 <head> 와 </head> 사이에 아래의 코드가 적용되어야 합니다.

<head>
<script>
function addBookmark(){
//var title = "[Viewit] 통신, IT, 모바일, 스마트폰 앱스 블로그";
//var url = "http://viewit.kr";
var title = document.title; //현재 보고 있는 페이지의 Title
var url = location.href; //현재 보고 있는 페이지의 Url
if(window.sidebar && window.sidebar.addPanel){ // Firefox
window.sidebar.addPanel(title, url,"");
}
else if(window.opera && window.print){ // Opera
var elem = document.createElement('a');
elem.setAttribute('href',url);
elem.setAttribute('title',title);
elem.setAttribute('rel','sidebar');
elem.click();
}
else if(document.all){ // Internet Explorer
window.external.AddFavorite( url, title);
}
else{
alert("이용하시는 웹 브라우저는 기능이 지원되지 않습니다.\n\nCtrl+D 키를 누르시면 즐겨찾기에 추가하실 수 있습니다.");
return true;
}
}
</script>
</head>

JavaScript 코드 사용 방법
  • 활용할 때에 사용해야 할 코드입니다.

<a href="javascript:addBookmark();">이 페이지를 즐겨찾기에 추가하기</a>

JavaScript 코드 문서 다운로드

내용 출처/참고 자료 Lael's World (http://lael.be/469)
1 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

[CSS] 초기화(Reset) 코드

CSS (종속형 시트, Cascading Style Sheet: 캐스케이딩 스타일 시트)

웹 문서의 전반적인 스타일을 미리 저장해 둔 스타일 시트이며 문서 전체의 일관성을 유지할 수 있고, 세세한 스타일 지정의 필요를 줄어들게 하여 더 편리하게 코딩할 수 있습니다.

CSS 초기화(Reset) 코드

<style type="text/css">
@charset "utf-8";

/* base */
body{font:0.75em Gulim, "굴림", Dotum, "돋움", sans-serif;color:#333}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, input, table, tr, th, td{margin:0;padding:0}
h1, h2, h3, h4, h5, h6{font-weight:normal;font-size:100%}
ul, ol, li{list-style:none}
fieldset, img{border:none}

/* a-style */
a{color:#333333;text-decoration:none}
a:hover, a:active{color:#FF4500;text-decoration:underline}
</style>

CSS 코드 문서 다운로드

0 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

[HTML] Google 크롬을 활용한 HTML5 웹사이트 확인

Google 크롬의 확장 프로그램으로 웹사이트가 HTML5 언어로 제작되었는지 알아볼 수 있습니다.

Google 크롬 웹 스토어 (Google Chrome Web Store)
  • • 크롬 웹 스토어는 구글에서 운영하는 운영하는 웹 기반 앱 스토어이며, 2010년 5월 19일 구글 I/O 컨퍼런스에 발표하여 2010년 12월 6일부터 운영중에 있습니다.
  • • 웹 스토어의 어플리케이션은 사용자가 Google 크롬, Google 크롬 OS에서 설치 및 실행을 할 수 있습니다.
  • • 웹 스토어의 어플리케이션은 HTML으로 제작되었으며, Google 크롬 브라우저를 기본으로 사용하고, 웹 스토어에 어플리케이션 등록과 설치의 비용은 무료입니다.

Google 크롬을 실행한 후 크롬 웹 스토어 (Chrome Web Store)로 접속합니다.

크롬 웹 스토어 검색창에 'html5 powerd'라고 입력한 후 엔터를 누릅니다. (검색이 진행됩니다.)

검색 결과에 'HTML5 Powerd' 어플리케이션이 보이면 'Chrome에 추가' 버튼을 눌러서 실행합니다.

설치 확인 창이 나오면 '설치'을 눌러서 설치를 진행합니다.

HTML5 Powered 확장 프로그램의 설치가 완료되면,
북마크(즐겨찾기) 아이콘 왼쪽에 HTML5 로고가 보여집니다.

HTML5 Powerd 확장 프로그램의 정보를 볼 수 있습니다.

크롬 확장 프로그램 관리자(명령어: chrome://settings/extensionSettings)에서
HTML5 Powerd가 설치된것을 확인하실 수 있습니다.

HTML5 언어로 제작된 제가 운영하는 Viewit 블로그에 접속한 화면입니다.
접속한 웹사이트가 HTML5 언어로 제작된 경우에는 HTML5 로고가 보여집니다.

0 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

[HTML] HTML5 설명 및 기본 마크업

HTML5 (Hypertext Markup Language; 하이퍼 텍스트 마크업 랭귀지)

HTML5 기본 설명
  • • HTML5는월드 와이드 웹(WWW; HTML 4.01, XHTML 1.0, DOM Level 2 HTML)에 대한 차기 버전의 마크업 언어입니다.
  • • 현재 자주 사용되는 Adobe Flash, Microsoft Silverlight, Sun Java FX와 같은 플러그인의 애플리케이션(Active X 등)을 대처하기 위함을 목적으로 하고있습니다.

HTML5 기본 마크업
  • • 구조적인 요소(div 대체, header 등) 및 멀티미디어 요소(플러그인 없이 멀티미디어 재생, audio 등)가 추가되었습니다.
  • • 일부 요소의 의미가 변경 및 문서 선언이 간소화 되었습니다.
  • • HTML5 기본 마크업 코드는 아래의 내용을 참조하시기 바랍니다.

<!DOCTYPE html>
<html lang="ko">
 <head>
  <meta charset="utf-8"/>
  <title>제목을 입력하세요.</title>
 </head>
<body>
 <header>header 값</header>
 <nav>nav 값</nav>
 <article>
  <section>
   section 값
  </section>
 </article>
 <aside>aside 값</aside>
 <footer>footer 값</footer>
 </body>
</html>

HTML 코드 문서 다운로드

0 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

인터넷 익스플로러(Internet Explorer)의 교차 사이트 스크립팅(XSS)

교차 사이트 스크립팅(XSS: Cross-Site Scripting)의 정의와 설명

교차 사이트 스크립팅(XSS)은 사이트 간 스크립팅 또는 크로스 사이트 스크립팅으로도 불립니다.

웹 애플리케이션에서 많이 나타나는 취약점의 하나로, 웹사이트 관리자가 아닌 이가 웹 페이지에 클라이언트 사이드 스크립트를 삽입하여 다른 사용자가 이를 실행하게끔 허용하는 취약점입니다.

Microsoft Internet Explorer 8 이상에서는 자동으로 이러한 악의적인 코드를 차단해 알림창이 보여주며, 사이트의 특정 페이지가 # 으로 표시되어 정상적으로 페이지를 볼 수 없게 합니다.

Internet Explorer에서 교차 사이트 스크립팅(XSS: Cross-Site Scripting)

다음은 Internet Explorer에서 교차 사이트 스크립팅(XSS) 기능을 해제하는 방법입니다.

교차 사이트 스크립팅(XSS) 기능은 보안 강화 기능이므로, 특별한 상황이 아니라면 해제하지 않도록 하는 것이 좋습니다.

특정 웹사이트 접속을 위하여 기능을 해제해야 하는 상황이라면, 이용 후에는 다시 기능을 작동시켜야 안전합니다.

위의 설명해드린것과 같이, 악의적인 코드가 삽입된 웹페이지에 접속하게 되면 위와 같이 경고 메시지가 나타나게 됩니다.

1. 인터넷 익스플로러(Internet Explorer)를 실행한 상태에서 톱니바퀴 아이콘(인터넷 옵션) (메뉴 > 도구 > 인터넷 옵션)을 클릭하여 인터넷 옵션을 실행합니다.

2. 보안 탭에서 '사용자 지정 수준(C)'을 클릭합니다.

3. '보안 설정 - 인터넷 영역' 창이 실행되면 스크롤을 아래쪽으로 내려 'XSS 필터 사용'을 찾아서, '사용 안함'에 체크하고 확인을 눌러줍니다.

4. 위와 같은 경고 메시지 창이 나타나도 무시하고 '예(Y)'를 클릭하여 위에서 선택한 사용 안함의 값을 적용합니다.

4 Comment,  0  Trackback
  • casisial
    XSS필터 사용안함하고 껏다켜도 특정사이트들어가면 똑같이 멈췄다가 작업표시줄에 뜨네요 어떻게해야되요?
  • 방문자
    XSS 필터 사용은 보안을 강화하는 옵션입니다.
    다만, 일시적으로 특정 사이트를 이용하기 위해 이를 해제할 필요성이 있다면 잠시 '사용 안 함'으로 해제할 수는 있을 것입니다. 해당 사이트 이용이 끝나면 다시 필터를 사용하는 것이 보안상 바람직합니다.

    MS에서 이 필터를 추가한 것은 그만큼 보안위험이 크기 때문이겠죠.
    그러므로 일반적인 사이트 이용시 큰 불편이 없다면 이 옵션을 해제하지 않는 것이 보안상 보다 안전한 서핑방법입니다.

    본문 마지막에 보면, 필터 사용을 해제하는 것이 마치 보안을 강화하는 것으로 오해할만한 내용이 있습니다.
    필터 사용을 해제하는 것이 보안을 약화시킨다는 것을 명시적으로 언급해야 한다고 봅니다.

    XSS 필터 사용을 해제하면 보안에 취약해지는 것인데, 사용자의 어떤 필요성 때문에 이런 보안위험을 감수하고서라도 일시적으로 필터 사용을 해제하고 싶다면 본문의 방법으로 해제할 수 있다.

    예를들어, 교차 스크립트는 사용자가 쇼핑몰의 결제 페이지에서 결제 관련 민감한 정보들을 입력하고 있을 때, 로그인 중인 다른 사이트에서 악의적인 교차스크립트가 실행되어 쇼핑몰 사이트의 결제 페이지에 입력된 내용들을 전송받아 가로챌 수 있습니다.
    쇼핑몰의 보안 프로그램이 교차 스크립트를 차단하면 다행이지만, 그렇지 못했을 때는 굉장히 위험한 상황인 것입니다. 이런 위험성 때문에 MS에서 교차스크립트의 실행을 차단하는 필터(방어막)를 도입한 것입니다. 그래서 IE 보안의 기본값이 필터를 사용하도록 설정돼 있는 것이고요.

    다만, 쇼핑몰 결제 페이지 같은 민감한 정보가 없는 단순한 사이트를 이용 중일 때, XSS 필터 때문에 어떤 불편을 겪는다면 잠시 해제할 수는 있을 것입니다. 설사 정보가 넘어가더라도 거의 중요하지 않은 정보일 경우에 말이죠.
    이 글의 주제는 옵션 해제방법에 대한 것이지만, XSS 필터가 어떤 것이고 이를 사용하는 것과 해제하는 것이 "보안상" 어떤 의미를 갖는 것인지에 대한 언급이 있었어야 한다고 봅니다.

    글의 전반부는 잘 되어 있는데, 방지라는 단어를 사용하면서부터는 마치 XSS 필터 옵션의 사용을 해제하는 것이 바람직한 것처럼 오해의 소지가 다분하게 작성되어 있습니다.
    하일라이트는 마지막 문장입니다. XSS 필터를 "사용 안 함"으로 설정하는 방법을 알려드렸다면서 보다 안전한 서핑을 즐기라는 표현입니다. 이 문장은 필터를 사용하지 않는 것이 보다 안전한 서핑이라는 뜻으로 오해할 소지가 크다고 봅니다.

    필터 해제는 이런 방법으로 할 수 있다는 것을 알려드리지만, 이것은 보안상으로 보자면 악의적인 스크립트를 차단하는 필터(방어막)를 해제하는 것이므로, 보안위협에 더 노출되는 것임을 독자에게 명시적으로 알렸어야 합니다.

    이 포스트의 전반부는 XSS 필터를 일반 독자에게 소개하고, 그것이 어떤 역할을 하는 것이지 언급한 점에서 훌륭한 포스트의 출발이었지만, 중반 이후 부적절한 용어의 선택과 XSS 필터의 해제가 보안상 어떤 의미를 가진다는 것을 언급하지 않았고, 심지어 거꾸로 필터 해제가 보다 보안을 강화시키는 것으로 오해할만한 여지를 주고 있으므로 매우 좋지 않은 포스트 내용이라고 봅니다. 심지어는 어떠한 불순한 의도를 가지고 일부러 이렇게 쓴 것이 아닌가 하는 생각마저 듭니다. 아니기를 바랍니다.

    서핑 중 우연히 방문한 사용자이고 악의는 전혀 없습니다. 컴퓨터 초보가 이 글을 읽는다면 매우 위험성이 크기 때문에 댓글을 달지 않을 수 없었습니다.
    이 글이 제 글이라면 얼굴이 화끈거릴 것인데 남 일 같지 않아서 주인장께 알려드리는 차원입니다. 속히 글을 손보셨으면 합니다.
    • 안녕하세요?
      의견을 남겨주셔서 감사합니다!

      남겨주신 의견처럼 다분히 오해의 소지가 있어보이게 포스팅을 해두었었던것 같습니다.

      지금 바로 내용을 일부 수정하였습니다.

      의견남겨주신점, 충고해주신점 감사합니다. :)

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

파이어폭스(Mozilla Firefox) 주소 명령 체계

파이어폭스(Mozilla Firefox)에서 사용가능한 특수 주소명령체계 목록

파이어폭스(Mozilla Firefox) 주소 명령 체계
명령어 기능 (설명)
about Firefox 버전과 정보를 볼 수 있습니다.
about:about about 명령어를 볼 수 있습니다.
about:addons Firefox 부가 기능 관리자(Add-on)를 실행합니다.
about:buildconfig Firefox 빌드(개발) 관련 정보를 볼 수 있습니다.
about:conflicts 기본 프로세스에 로드된 모든 모듈과 나중에 로드하도록 등록된 모듈을 보여줌.
about:cache 메모리에 캐시된 용량과 캐시로 저장된 파일 정보 및 저장 경로를 보여줌.
about:config Firefox 고급 환경 설정을 실행합니다. (모든 환경 설정을 보여줌)
about:crashes 전송한 보고서. 전송한 문제점 보고서 볼 수 있습니다.
about:credits Firefox를 만든이들과 기여자를 볼 수 있습니다.
about:home Firefox 시작 페이지. 기본 검색 페이지로 이동합니다.
about:license Firefox 라이선스 관련 정보를 볼 수 있습니다.
about:logo Firefox 로고를 볼 수 있습니다.
about:memory 현재 사용중인 메모리를 볼 수 있습니다.
about:mozilla 이스터 에그로, 모질라서라 불리는 가상의 책에 있는 내용을 볼 수 있습니다.
[ 모질라서란? ]
about:plugins Firefox에서 사용 가능한 설치된 플러그인 정보를 볼 수 있습니다.
about:privatebrowsing 사생활 보호 모드. 방문 기록, 검색 기록, 다운로드 기록, 폼 양식 기록, 쿠키, 임시 파일 등이 PC에 저장하지 않습니다. (다운로드 목록 및 북마크 내용은 저장됨.)
about:rights Firefox 소프트웨어 권한 정보를 볼 수 있습니다.
about:robots 이스터 에그로, 로봇에 관련된 이야기를 볼 수 있습니다.
about:sessionrestore 이전 세션이 불안정한 종료가 된 경우, 해당 세션을 복구 할 수 있습니다.
about:support 문제 해결 정보. Firefox 사용시 발생한 문제점을 해결 할 수 있는 정보를 보여줌.
chrome://print 인쇄(프린트) 미리 보기를 실행합니다.
about:sync-log / about:sync-log.1 동기화(싱크) 기록을 볼 수 있습니다.
about:sync-tabs 다른 컴퓨터에 저장된 탭 목록을 볼 수 있습니다.
resource:/// Firefox 설치폴더에 있는 파일목록을 볼 수 있습니다.
view-source:'URL' 지정한 URL의 소스코드를 볼 수 있습니다.
0 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

세리프(Serif)와 산세리프(Sans-Serif) 폰트 타입

가독성(可讀性])과 판독성(判讀性)

글꼴의 차이를 다룰때 가독성과 판독성이 제일 중요 합니다.

가독성: 인쇄물이 얼마나 쉽게 읽히는가 하는 능률의 정도. 활자체, 글자 간격, 행간(行間), 띄어쓰기 따위에 따라 달라 집니다. (많은 양의 텍스트의 읽기 쉬운 정도를 나타내는 용어)

판독성: (인쇄물의) 판독성. 문자의 크기나 특징, 자간·행간 등 전체적 레이아웃에 걸친 읽기의 용이성(容易性). (텍스트의 큰 제목이나 버튼 등 짧은 텍스트를 얼마나 쉽게 알아볼 수 있는가를 나타내는 용어)

단, 상황(경우)에 따라 매우 다르게 측정 될 수 있다고 합니다.

세리프 (Serif)

세리프의 사전적 의미로는 인쇄된 H나 I 같은 활자에서 아래 또는 위에 가로로 나 있는 가는 선을 뜻하며, 타이포그래피(typography)에서 글꼴을 이루는 세로획의 끝이 돌기처럼 나와 장식적인 느낌을 주어 글꼴에 맵시를 내거나 가독성을 높이기 위해 장식한 서체(글꼴)를 칭합니다.

대표적 폰트: 바탕체, 궁서체, Time New Roman

CSS(Style sheet)에서 사용법: font {font-family:Time New Roman, Serif;}

산세리프 (Sans-serif)

Sans는 프랑스어로 '없다' 라는 뜻의 단어 입니다. 다시 말해, Sans-serif는 serif가 없다는 뜻입니다. 한마디로 획의 삐침이 없는 글씨체(폰트)를 뜻하는 말입니다. 실제로 sans-serif를 지정하지 않는 경우 넷스케이프 네비게이터 웹브라우저는 '돋움' 이나 '명조'로 출력하는 문제가 있습니다.

대표적인 폰트: 굴림체, 돋움체, Arial, Verdana

CSS(Style sheet)에서 사용법 : font {font-family:Arial, Sans-serif;}

0 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

[HTML] 문자 세트 및 기호 간접 표현식

특수문자 코드

문 자 엔티티 번호 엔티티 이름 설 명
" &#34; &quot; 인용부호
' &#39; &apos; 아포스트로피
& &#38; &amp; 앰퍼샌드
< &#60; &lt; 보다 작음
> &#62; &gt; 보다 큼

HTML ISO-8859-1

ISO-8859-1는 대부분의 브라우저에 설정된 기본 문자입니다.

첫 번째 128 문자는 원래 아스키는 문자 (숫자 0-9, 대문자와 소문자 영어 알파벳과 일부 특수 문자)로 설정됩니다.

ISO-8859-1의 높은 부분 (160-255 코드)은 서유럽 국가와 몇 가지 일반적으로 사용되는 특수 문자에 사용된 문자가 포함되어 있습니다.

이는 독립체 또는 예약 문자를 구현하는 쉽게 키보드로 입력할 수 없는 문자를 표현하는 데 사용됩니다.

ISO 8859-1 부호

문 자 엔티티 번호 엔티티 이름 설 명
  &#160; &nbsp; non-breaking space
¡ &#161; &iexcl; inverted exclamation mark
¢ &#162; &cent; cent
£ &#163; &pound; pound
¤ &#164; &curren; currency
¥ &#165; &yen; yen
¦ &#166; &brvbar; broken vertical bar
§ &#167; &sect; section
¨ &#168; &uml; spacing diaeresis
© &#169; &copy; copyright
ª &#170; &ordf; feminine ordinal indicator
« &#171; &laquo; angle quotation mark (left)
¬ &#172; &not; negation
­ &#173; &shy; soft hyphen
® &#174; &reg; registered trademark
¯ &#175; &macr; spacing macron
° &#176; &deg; degree
± &#177; &plusmn; plus-or-minus 
² &#178; &sup2; superscript 2
³ &#179; &sup3; superscript 3
´ &#180; &acute; spacing acute
µ &#181; &micro; micro
&#182; &para; paragraph
· &#183; &middot; middle dot
¸ &#184; &cedil; spacing cedilla
¹ &#185; &sup1; superscript 1
º &#186; &ordm; masculine ordinal indicator
» &#187; &raquo; angle quotation mark (right)
¼ &#188; &frac14; fraction 1/4
½ &#189; &frac12; fraction 1/2
¾ &#190; &frac34; fraction 3/4
¿ &#191; &iquest; inverted question mark
× &#215; &times; multiplication
÷ &#247; &divide; division
내용 출처/참고 자료 W3Schools.com (HTML ISO-8859-1 Reference)
0 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)

meta 태그를 이용한 Internet Explorer 랜더링 설정

HTML 문서내에 DTD 정의 유무에 따라 다음과 같이 렌더링해야 합니다.

DTD 정의가 있는 경우: Standard Mode

DTD 정의가 없는 경우: Quirks Mode

Standard Mode 설정 (DTD 정의가 있는 경우): <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

Quirks Mode 설정 (DTD 정의가 없는 경우)

Internet Explorer 7 Standards 모드
  • <meta http-equiv="X-UA-Compatible" content="IE=7" />

Internet Explorer 8 Standards 모드
  • <meta http-equiv="X-UA-Compatible" content="IE=8" />

가장 최신 Internet Explorer 버전의 Standards 모드
  • <meta http-equiv="X-UA-Compatible" content="IE=Edge" />

0 Comment,  0  Trackback

본 게시물에 대한 질문은 댓글을 통하여 받습니다. 바른말, 고운 말을 사용하여 남겨주세요. :)