CSS에 문자셋을 지정하면 에디터에서 한글이 깨지지 않습니다.

CSS 에 문자셋을 지정하면 에디터에서 한글이 깨지지 않는다는 사실 혹시 알고 계셨나요?
이런 경우가 종종 있죠.

한글 주석 달았는데 열어보니 깨져있고…

이런 케이스는 문서 저장할 때 EUC-KR 인코딩으로 저장한 다음, 드림위버의 새문서 열기 형식을 UTF-8 으로 설정해 놓고 EUC-KR 으로 저장한 문서를 열 때 발생합니다.

하지만 CSS 문서에 아래와 같은 형식으로 문서 인코딩 형식을 제대로 명시해 주면 깨지지 않습니다. CSS 문서 첫줄에 공백 없이 입력 합니다.

@charset "euc-kr";
@charset "utf-8";

직접 타이핑 하기 귀찮죠.

단축키 Ctrl+J 키를 누르면 현재 문서의 Document Encoding 을 바꿀 수가 있습니다. 그럼 캐릭터셋 정의문구가 삽입되고 문서 저장할 때 인코딩 형식도 그에 맞게 바뀝니다.

분류: 드림위버 | 2007년 12월 21일, 19:05 | 정찬명 | 댓글: 9개 |
트랙백URI - http://naradesign.net/wp/2007/12/21/134/trackback/

9개의 댓글이 있습니다.

  1. mAGa 님의 말:

    행복한 성탄되시길 기원합니다.
    새해에도 좋은 읽을거리 많이 부탁드립니다.

  2. 정찬명 님의 말:

    감사합니다.(__) mAGa님도 가족과 함께 즐거운 연말연시 보네세요^^

  3. 장호순 님의 말:

    안녕하세요.
    무작정 따라해서 지금은 많은 문제점으로 고생하고 있습니다.
    완전초보라서 정찬명님의 좋은 문제 해답도 제 메인페이지에 어떻게
    적용해야하는지도 얼떨떨합니다.
    갑자기 제 홈이 팝업메뉴도 안뜨고, 한글이 ?로 나옵니다.
    CSS 문서 첫줄이라하며는 code 를 클릭했을때 나오는 맨 첫줄 1번이란 뜻인가요?
    그렇게 해 보았는데 안되는군요.
    자세한 설명 부탁드립니다.
    그리고 다시 제 홈을 원상태로 되돌릴수 있을까요?
    답변 부탁드립니다.

  4. 정찬명 님의 말:

    장호순님 안녕하세요? 글자가 깨지는 현상때문에 애를 먹고 계시는군요. 결론부터 말씀드리면 index.htm 파일을 내려받아서 복구해 보려 했지만 이미 한글이 깨져서 복구할 수 없는 상태가 되었습니다. 따라서 큰 도움은 안되시겠지만 상황설명만 해드리겠습니다. 지금 장호순님 웹사이트를 방문해 보니 HTML 문서의 캐릭터셋이 아래와 같이 잘못된 문법으로 지정되어 있는것을 발견하였습니다.

    [meta http-equiv="Content-Type" content="text/html; charset=euc-kr";charset "utf-8";]

    현재 meta 태그는 위와 같이 알 수 없는 코드로 설정되어 있고 파일의 인코딩 형식(저장 포멧)은 또 euc-kr 형식 입니다. 어떻게 이런 코드가 생성되었는지 모르겠지만 드림위버가 자동으로 생성했다면 드림위버의 버그로 봐야 할것 같구요. 직접 이렇게 코딩하셨다면 사용자 버그입니다.(__) 한편 드림위버는 HTML 코드가 문법에 맞지 않고 좀 많이 꼬이는 경우 이런 버그를 유발할 수도 있습니다.

    이 포스트의 제 설명은 CSS 파일을 외부에 별도로 두고 HTML 문서에서 외부 CSS 파일을 링크하거나 불러오는(link, import) External Style 방식일 때 CSS 문서에 대하여 지정하는 캐릭터셋에 대한 설명이었습니다. 하지만 현재 장호순님의 웹사이트는 External Style 이 아니고 CSS 코드가 HTML 문서의 [head] 안에 포함된 Internal Style 방식을 사용하셨으므로 현재의 제 포스팅이 전혀 도움이 되지 않는 상황이었습니다.

    깨진 한글은 사본을 복사해 두지 않으셨다면 복구할 수 없으므로 할 수 있는 최선을 말씀드리면 아래와 같습니다.

    1. 잘못 설정된 아래 meta 태그 부분을 아예 삭제 합니다.
    [meta http-equiv="Content-Type" content="text/html; charset=euc-kr";charset "utf-8";]

    2. 삭제된 meta 태그 자리에 아래 코드를 삽입합니다.
    [meta http-equiv="Content-Type" content="text/html; charset=utf-8" /]

    3. 페이지의 속성을 지정하는 단축키 Ctrl+J 를 눌러서 다음과 같이 설정합니다.
    Page Properties → Cotegory → Title/Encoding → Encoding → 유니코드(UTF-8) 선택

    4. 파일을 저장한 다음 코드뷰(소스보기모드)에서 깨진 한글을 다시 원래 상태로 수작업으로 복구 합니다.

    깨진 한글을 복구할 수 없게 되어 안타깝고 본의아니게 죄송스럽게(?) 되었지만 좋은 하루 되시길 빕니다. ^^ (사실 전 잘못한것 없어요 ㅜㅜ;)

  5. 장호순 님의 말:

    상세하고 자상한 설명 정말 고맙습니다.
    제가 코드에 대한 지식이 없다보니 아주 꼬이고 꼬인 것 같군요.
    마음을 새 하얗게 정리하고 다시 돌아가렵니다.
    제 홈을 만들다가 의문사항이 있으면 언제든지 들어오겠습니다.
    감사합니다.

  6. 장호순 님의 말:

    안녕하세요.
    소개를 보니 참여 프로젝트에 제로보드가 있더군요.
    제가 요즘 골치 아프게 실행이 안되는 것이 있습니다.
    드림위버로 메인 홈을 만들고 그 페이지에 로그인 정보 폼과 기본 플레쉬 카운터를 삽입하려고 수차례
    시도를 했는데 실패가 거듭입니다.
    그래서 포기를 하고 회원가입과 로그인 이미지를 만들어 링크를 시켜 놓았습니다.
    그런데 그것도 로그인을 하면 http://www.sorivizgi.com/zbxe/? 이 화면으로 돌아갑니다.
    돌아가기 하면 돌아가지도 않구요.
    외부페이지를 이용한다는 것은 알고 있는데 도무지 실행이 안되는 것이 왜 그런지 알수가 없습니다.
    좀전에 카운터를 넣으려고 시도를 했는데 외부페이지 보기에서 http://www.sorivizgi.com/zbxe/counter 화면이 뜨는데 폼은 게시판 폼입니다.
    해결해야 할 것이 많아 글이 난잡해 진 것 같습니다.
    제가 하려고 하는 것은
    제 메인 홈 왼쪽 상단에 로그인 폼과 가장 아래 부분에 카운터 기본정보를 넣는 것입니다.
    저의 질문에 좋은 답변 부탁 드립니다.
    감사합니다.

  7. 정찬명 님의 말:

    장호순님, 안녕하세요? 저는 개인적으로 워드프레스 블로그를 쓰는지라 제로보드는 테스트삼아 설치만 해놓고 사용해보지 못했답니다. ㅡㅡ; 도움 못드려 죄송합니다. 대신 제로보드 공식 웹사이트에서 문제를 해결하실 수 있을것 같습니다. http://www.zeroboard.com/zbxe_main

  8. 김진섭 님의 말:

    안녕하세요. 항상 좋은 글들 감사합니다,.
    제가 만든 사이트에도 이런 현상이 생기네요,, css에서 @charset “euc-kr”; 를 지정했거든요,,
    그리고 에디터를 글쓰기에 달았는데 어떤 경우인지 (따른 곳에서 글을 땡겨왔는지.. 아니면 직접 편집을 한건지 모르겠지만,)
    사용자가 글을 적으면 경우에 따라서 물음표가 생기네요,, 어떤 경우인지 실험을 이리저리 해봐도 제가 하면 안되는데
    올라온 게시물에는 ? 가 있네요,, 이건 어떻게 해야할까요,,
    참고로 게시물의 주소는

    http://www.casa.co.kr/lounge/house_view.jsp?bbsCd=BCGC010001&bbsNum=58964&pageNo=1&category_num=&bestFlag=

    이고 jweditor를 사용했습니다,
    어떻게 해야할까요,,, 그렇다고 utf-8로 다 바꿀려고하니 이전의 자료들이 많아서 바꾸면 안된다고 해서리,,,
    부탁드립니당,,

  9. 정찬명 님의 말:

    김진섭님, 안녕하세요? 게시물을 살펴보니 한글 또는 워드등의 문서 편집기에서 작성한 다음 복사해서 붙여넣기 된 게시물인것으로 판단됩니다. 한글이나 워드에서 옮겨오는 텍스트 중에는 웹에서 표현할 수 없는 특수문자나 공백등이 포함되어 있는데요. 이런경우 물음표 “?” 또는 “□” 표시로 대체됩니다. 이런 경우는 게시판의 문제라기 보다는 게시물 작성자가 주의를 기울여야 할 부분인것 같습니다. 한글등의 편집기에서 글을 옮겨오는 경우 웹에서 표현할 수 없는 특수문자가 있음을 알려주신 후 게시물을 정교하게 다시 편집하도록 요청하시는게 어떨까요?

댓글 남기기

전송된 글이 나타나지 않는다면 필터링 된 것입니다. dece24앳gmail.com 으로 메일 주세요.
(X)HTML 코드 사용이 가능하지만 소스 코드 출력을 원하시면 <꺽쇠>는 [괄호]로 변환하여 작성해 주세요.

필수 아님

필수 아님