'프로그래밍/기타 등등'에 해당되는 글 15건
- 2009.09.29 언어(ISO 639) 코드
- 2009.09.25 네이버 스마트에디터, 다음 오픈에디터
- 2009.08.07 HTML 특수문자코드표
- 2009.08.06 [펌] [CSS] IE6리하 PNG 투명값처리 소스들..
- 2009.08.06 [펌][CSS] PNG 포멧 용법
언어명 | 코드 | 언어 구룹 | |||
A | ABKHAZIAN | AB | IBERO-CAUCASIAN | 이베리아-코카시안어 | |
AFAN (OROMO) | OM | HAMITIC | 햄족언어 | ||
AFAR | AA | HAMITIC | 햄족언어 | ||
AFRIKAANS | AF | GERMANIC | 게르만어 | ||
ALBANIAN | 알바니아어 | SQ | INDO-EUROPEAN(OTHER) | 인도-유럽어(기타) | |
AMHARIC | AM | SEMITIC | 쎔족언어 | ||
ARABIC | 아랍어 | AR | SEMITIC | 쎔족언어 | |
ARMENIAN | 아르메니아어 | HY | INDO-EUROPEAN(OTHER) | 인도-유럽어(기타) | |
ASSAMESE | AS | INDIAN | 인도어 | ||
AYMARA | AY | AMERINDIAN | |||
AZERBAIJANI | AZ | TURKIC/ALTAIC | 터키/알타이어 | ||
B | BASHKIR | BA | TURKIC/ALTAIC | 터키/알타이어 | |
BASQUE | 바스큐어 | EU | BASQUE | 바스큐어(스페인계) | |
BENGALI;BANGLA | 벵갈어 | BN | INDIAN | 인도어 | |
BHUTANI | 부탄어 | DZ | ASIAN | 아시아어 | |
BIHARI | BH | INDIAN | 인도어 | ||
BISLAMA | BI | [not given] | 미분류 | ||
BRETON | BR | CELTIC | 셀틱어(인도-유럽어계) | ||
BULGARIAN | 불가리아어 | BG | SLAVIC | 슬라브어 | |
BURMESE | 버마어 | MY | ASIAN | 아시아어 | |
BYELORUSSIAN | BE | SLAVIC | 슬라브어 | ||
C | CAMBODIAN | 캄보디아어 | KM | ASIAN | 아시아어 |
CATALAN | 카탈리아어 | CA | ROMANCE | 로만스어 | |
CHINESE | 중국어 | ZH | ASIAN | 아시아어 | |
CORSICAN | CO | ROMANCE | 로만스어 | ||
CROATIAN | 크로아티아어 | HR | SLAVIC | 슬라브어 | |
CZECH | 체코어 | CS | SLAVIC | 슬라브어 | |
D | DANISH | 덴마크어 | DA | GERMANIC | 게르만어 |
DUTCH | 네델란드어 | NL | GERMANIC | 게르만어 | |
E | ENGLISH | 영어 | EN | GERMANIC | 게르만어 |
ESPERANTO | 에스페란또 | EO | INTERNATIONAL AUX. | 국제어 | |
ESTONIAN | 에스토니아어 | ET | FINNO-UGRIC | 피노-우그릭어 (동북유럽에서 시베리아) | |
F | FAROESE | FO | GERMANIC | 게르만어 | |
FIJI | 피지어 | FJ | OCEANIC/INDONESIAN | 호주/인도네시아어 | |
FINNISH | 핀랜드어 | FI | FINNO-UGRIC | 피노-우그릭어 (동북유럽에서 시베리아) | |
FRENCH | 불어 | FR | ROMANCE | 로만스어 | |
FRISIAN | FY | GERMANIC | 게르만어 | ||
G | GALICIAN | GL | ROMANCE | 로만스어 | |
GEORGIAN | KA | IBERO-CAUCASIAN | 이베리아-코카시안어 | ||
GERMAN | 독일어 | DE | GERMANIC | 게르만어 | |
GREEK | 그리스어 | EL | LATIN/GREEK | 라틴/그리스어 | |
GREENLANDIC | 그린랜드어 | KL | ESKIMO | 에스키모어 | |
GUARANI | GN | AMERINDIAN | |||
GUJARATI | GU | INDIAN | 인도어 | ||
H | HAUSA | HA | NEGRO-AFRICAN | 아프리카 흑인어 | |
HEBREW | 희랍어 | HE | SEMITIC | 쎔족언어 | |
HINDI | 힌두어 | HI | INDIAN | 인도어 | |
HUNGARIAN | 항가리어 | HU | FINNO-UGRIC | 피노-우그릭어 (동북유럽에서 시베리아) | |
I | ICELANDIC | 아이스랜드어 | IS | GERMANIC | 게르만어 |
INDONESIAN | 인도네시아어 | ID | OCEANIC/INDONESIAN | 호주/인도네시아어 | |
INTERLINGUA | IA | INTERNATIONAL AUX. | 국제어 | ||
INTERLINGUE | IE | INTERNATIONAL AUX. | 국제어 | ||
INUKTITUT | IU | [] | |||
INUPIAK | IK | ESKIMO | 에스키모어 | ||
IRISH | 아이랜드어 | GA | CELTIC | 셀틱어(인도-유럽어계) | |
ITALIAN | 이태리어 | IT | ROMANCE | 로만스어 | |
J | JAPANESE | 일본어 | JA | ASIAN | 아시아어 |
JAVANESE | 자바어 | JV | OCEANIC/INDONESIAN | 호주/인도네시아어 | |
K | KANNADA | KN | DRAVIDIAN | 드라빗어(남부인도지역) | |
KASHMIRI | 카쉬미르어 | KS | INDIAN | 인도어 | |
KAZAKH | 카자크어 | KK | TURKIC/ALTAIC | 터키/알타이어 | |
KINYARWANDA | RW | NEGRO-AFRICAN | 아프리카 흑인어 | ||
KIRGHIZ | KY | TURKIC/ALTAIC | 터키/알타이어 | ||
KURUNDI | RN | NEGRO-AFRICAN | 아프리카 흑인어 | ||
KOREAN | 한국어 | KO | ASIAN | 아시아어 | |
KURDISH | KU | IRANIAN | 이란어 | ||
L | LAOTHIAN | 라오타이어 | LO | ASIAN | 아시아어 |
LATIN | 라틴어 | LA | LATIN/GREEK | 라틴/그리스어 | |
LATVIAN;LETTISH | 라트비아어 | LV | BALTIC | 발틱어 | |
LINGALA | LN | NEGRO-AFRICAN | 아프리카 흑인어 | ||
LITHUANIAN | 리투아니아어 | LT | BALTIC | 발틱어 | |
M | MACEDONIAN | 마케도니아어 | MK | SLAVIC | 슬라브어 |
MALAGASY | 말라가시어 | MG | OCEANIC/INDONESIAN | 호주/인도네시아어 | |
MALAY | 말레이어 | MS | OCEANIC/INDONESIAN | 호주/인도네시아어 | |
MALAYALAM | ML | DRAVIDIAN | 드라빗어(남부인도지역) | ||
MALTESE | 말타어 | MT | SEMITIC | 쎔족언어 | |
MAORI | MI | OCEANIC/INDONESIAN | 호주/인도네시아어 | ||
MARATHI | MR | INDIAN | 인도어 | ||
MOLDAVIAN | 몰다비아어 | MO | ROMANCE | 로만스어 | |
MONGOLIAN | 몽고어 | MN | [not given] | 미분류 | |
N | NAURU | NA | [not given] | 미분류 | |
NEPALI | 네팔어 | NE | INDIAN | 인도어 | |
NORWEGIAN | 놀웨이어 | NO | GERMANIC | 게르만어 | |
O | OCCITAN | OC | ROMANCE | 로만스어 | |
ORIYA | OR | INDIAN | 인도어 | ||
P | PASHTO;PUSHTO | PS | IRANIAN | 이란어 | |
PERSIAN (farsi) | 페르샤어 | FA | IRANIAN | 이란어 | |
POLISH | 폴랜드어 | PL | SLAVIC | 슬라브어 | |
PORTUGUESE | 폴튜갈어 | PT | ROMANCE | 로만스어 | |
PUNJABI | PA | INDIAN | 인도어 | ||
Q | QUECHUA | QU | AMERINDIAN | ||
R | RHAETO-ROMANCE | RM | ROMANCE | 로만스어 | |
ROMANIAN | 루마니아어 | RO | ROMANCE | 로만스어 | |
RUSSIAN | 러시아어 | RU | SLAVIC | 슬라브어 | |
S | SAMOAN | 사모아어 | SM | OCEANIC/INDONESIAN | 호주/인도네시아어 |
SANGHO | SG | NEGRO-AFRICAN | 아프리카 흑인어 | ||
SANSKRIT | SA | INDIAN | 인도어 | ||
SCOTS GAELIC | GD | CELTIC | 셀틱어(인도-유럽어계) | ||
SERBIAN | 세르비아어 | SR | SLAVIC | 슬라브어 | |
SERBO-CROATIAN | 세르비아-크로아타아어 | SH | SLAVIC | 슬라브어 | |
SESOTHO | ST | NEGRO-AFRICAN | 아프리카 흑인어 | ||
SETSWANA | TN | NEGRO-AFRICAN | 아프리카 흑인어 | ||
SHONA | SN | NEGRO-AFRICAN | 아프리카 흑인어 | ||
SINDHI | SD | INDIAN | 인도어 | ||
SINGHALESE | SI | INDIAN | 인도어 | ||
SISWATI | SS | NEGRO-AFRICAN | 아프리카 흑인어 | ||
SLOVAK | 슬로바키아어 | SK | SLAVIC | 슬라브어 | |
SLOVENIAN | 슬로베니아어 | SL | SLAVIC | 슬라브어 | |
SOMALI | 소말리아어 | SO | HAMITIC | 햄족언어 | |
SPANISH | 스페인어 | ES | ROMANCE | 로만스어 | |
SUNDANESE | SU | OCEANIC/INDONESIAN | 호주/인도네시아어 | ||
SWAHILI | SW | NEGRO-AFRICAN | 아프리카 흑인어 | ||
SWEDISH | 스웨덴어; | SV | GERMANIC | 게르만어 | |
T | TAGALOG | TL | OCEANIC/INDONESIAN | 호주/인도네시아어 | |
TAJIK | TG | IRANIAN | 이란어 | ||
TAMIL | TA | DRAVIDIAN | 드라빗어(남부인도지역) | ||
TATAR | 타타르어 | TT | TURKIC/ALTAIC | 터키/알타이어 | |
TELUGU | TE | DRAVIDIAN | 드라빗어(남부인도지역) | ||
THAI | 타이(태국)어 | TH | ASIAN | 아시아어 | |
TIBETAN | 티베트어 | BO | ASIAN | 아시아어 | |
TIGRINYA | TI | SEMITIC | 쎔족언어 | ||
TONGA | TO | OCEANIC/INDONESIAN | 호주/인도네시아어 | ||
TSONGA | TS | NEGRO-AFRICAN | 아프리카 흑인어 | ||
TURKISH | 터키어 | TR | TURKIC/ALTAIC | 터키/알타이어 | |
TURKMEN | TK | TURKIC/ALTAIC | 터키/알타이어 | ||
TWI | TW | NEGRO-AFRICAN | 아프리카 흑인어 | ||
U | UIGUR | UG | [] | ||
UKRAINIAN | 우크라이나어 | UK | SLAVIC | 슬라브어 | |
URDU | UR | INDIAN | 인도어 | ||
UZBEK | 우즈베크어 | UZ | TURKIC/ALTAIC | 터키/알타이어 | |
V | VIETNAMESE | 베트남어 | VI | ASIAN | 아시아어 |
VOLAPUK | VO | INTERNATIONAL AUX. | 국제어 | ||
W | WELSH | CY | CELTIC | 셀틱어(인도-유럽어계) | |
WOLOF | WO | NEGRO-AFRICAN | 아프리카 흑인어 | ||
X | XHOSA | XH | NEGRO-AFRICAN | 아프리카 흑인어 | |
Y | YIDDISH | YI | GERMANIC | 게르만어 | |
YORUBA | YO | NEGRO-AFRICAN | 아프리카 흑인어 | ||
Z | ZHUANG | ZA | [] | ||
ZULU | 줄루어 | ZU | NEGRO-AFRICAN | 아프리카 흑인어 |
http://trio.co.kr/webrefer/others/langabc.html
'프로그래밍 > 기타 등등' 카테고리의 다른 글
[오류] 유효하지 않거나 지원하지 않는 압축 형식을 사용하므로 현재 페이지를 표시할 수 없습니다. (0) | 2009.10.16 |
---|---|
이미지 사이즈를 줄여서 홈페이지에 업로드하기 (0) | 2009.10.16 |
네이버 스마트에디터, 다음 오픈에디터 (0) | 2009.09.25 |
HTML 특수문자코드표 (0) | 2009.08.07 |
[펌] [CSS] IE6리하 PNG 투명값처리 소스들.. (0) | 2009.08.06 |
지금 현재 내가 쓰고 있는 에디터는 스마트에디터이다.
그런데 다국어가 필요해서 검색을 하다가 다음 오픈에디터를 발견했다.
그래서 데모를 보니 스마트보다 괜찮아보이네?
재빨리 적용해봐야지.
네이버 스마트에디터 http://dev.naver.com/projects/smarteditor
데모 http://dev.naver.com/projects/smarteditor/wiki/SmartEditorBasicUserInterfacePreview
다음 에디터 http://code.google.com/p/daumopeneditor/
데모 http://uie.daum.net/openeditor/sample/1.5.1/editor.html
'프로그래밍 > 기타 등등' 카테고리의 다른 글
이미지 사이즈를 줄여서 홈페이지에 업로드하기 (0) | 2009.10.16 |
---|---|
언어(ISO 639) 코드 (0) | 2009.09.29 |
HTML 특수문자코드표 (0) | 2009.08.07 |
[펌] [CSS] IE6리하 PNG 투명값처리 소스들.. (0) | 2009.08.06 |
[펌][CSS] PNG 포멧 용법 (0) | 2009.08.06 |
표현문자 |
숫자표현 |
문자표현 |
설명 |
- |
�- |
- |
사용하지 않음 |
space |
	 |
- |
수평탭 |
space |
|
- |
줄 삽입 |
- |
- |
- |
사용하지 않음 |
space |
  |
- |
여백 |
! |
! |
- |
느낌표 |
" |
" |
" |
따옴표 |
# |
# |
- |
숫자기호 |
$ |
$ |
- |
달러 |
% |
% |
- |
백분율 기호 |
& |
& |
& |
Ampersand |
' |
' |
- |
작은 따옴표 |
( |
( |
- |
왼쪽 괄호 |
) |
) |
- |
오른쪽 괄호 |
* |
* |
- |
아스트릭 |
+ |
+ |
- |
더하기 기호 |
, |
, |
- |
쉼표 |
- |
- |
- |
Hyphen |
. |
. |
- |
마침표 |
/ |
/ |
- |
Solidus (slash) |
0 - 9 |
0-9 |
- |
0부터 9까지 |
: |
: |
- |
콜론 |
; |
; |
- |
세미콜론 |
< |
< |
< |
보다 작은 |
= |
= |
- |
등호 |
> |
> |
> |
보다 큰 |
? |
? |
- |
물음표 |
@ |
@ |
- |
Commercial at |
A - Z |
A-Z |
- |
A부터 Z까지 |
[ |
[ |
- |
왼쪽 대괄호 |
\ |
\ |
- |
역슬래쉬 |
] |
] |
- |
오른쪽 대괄호 |
^ |
^ |
- |
탈자부호 |
_ |
_ |
- |
수평선 |
` |
` |
- |
Acute accent |
a - z |
a-z |
- |
a부터 z까지 |
{ |
{ |
- |
왼쪽 중괄호 |
| |
| |
- |
수직선 |
} |
} |
- |
오른쪽 중괄호 |
~ |
~ |
- |
꼬리표 |
- |
-Ÿ |
- |
사용하지 않음 |
공백 |
  |
|
Non-breaking space |
¡ |
¡ |
¡ |
거꾸로된 느낌표 |
¢ |
¢ |
¢ |
센트 기호 |
£ |
£ |
£ |
파운드 |
¤ |
¤ |
¤ |
현재 환율 |
¥ |
¥ |
¥ |
엔 |
| |
¦ |
¦ |
끊어진 수직선 |
§ |
§ |
§ |
섹션 기호 |
¨ |
¨ |
¨ |
움라우트 |
ⓒ |
© |
© |
저작권 |
ª |
ª |
ª |
Feminine ordinal |
≪ |
« |
« |
왼쪽 꺾인 괄호 |
¬ |
¬ |
¬ |
부정 |
|
­ |
­ |
Soft hyphen |
? |
® |
® |
등록상표 |
&hibar; |
¯ |
¯ |
Macron accent |
° |
° |
° |
Degree sign |
± |
± |
± |
Plus or minus |
² |
² |
² |
Superscript two |
³ |
³ |
³ |
Superscript three |
´ |
´ |
´ |
Acute accent |
μ |
µ |
µ |
Micro sign (Mu) |
¶ |
¶ |
¶ |
문단기호 |
· |
· |
· |
Middle dot |
¸ |
¸ |
¸ |
Cedilla |
¹ |
¹ |
¹ |
Superscript one |
º |
º |
º |
Masculine ordinal |
≫ |
» |
» |
오른쪽 꺾인 괄호 |
¼ |
¼ |
¼ |
4분의 1 |
½ |
½ |
½ |
2분의 1 |
¾ |
¾ |
¾ |
4분의 3 |
¿ |
¿ |
¿ |
거꾸로된 물음표 |
A |
À |
À |
Capital A, grave accent |
A |
Á |
Á |
Capital A, acute accent |
A |
 |
 |
Capital A, circumflex accent |
A |
à |
à |
Capital A, tilde |
A |
Ä |
Ä |
Capital A, dieresis or umlaut mark |
A |
Å |
Å |
Capital A, ring (Angstrom) |
Æ |
Æ |
Æ |
Capital AE diphthong (ligature) |
C |
Ç |
Ç |
Capital C, cedilla |
E |
È |
È |
Capital E, grave accent |
E |
É |
É |
Capital E, acute accent |
E |
Ê |
Ê |
Capital E, circumflex accent |
E |
Ë |
Ë |
Capital E, dieresis or umlaut mark |
I |
Ì |
Ì |
Capital I, grave accent |
I |
Í |
Í |
Capital I, acute accent |
I |
Î |
Î |
Capital I, circumflex accent |
I |
Ï |
Ï |
Capital I, dieresis or umlaut mark |
Ð |
Ð |
Ð |
Capital Eth, Icelandic |
N |
Ñ |
Ñ |
Capital N, tilde |
O |
Ò |
Ò |
Capital O, grave accent |
O |
Ó |
Ó |
Capital O, acute accent |
O |
Ô |
Ô |
Capital O, circumflex accent |
O |
Õ |
Õ |
Capital O, tilde |
O |
Ö |
Ö |
Capital O, dieresis or umlaut mark |
× |
× |
× |
Multiply sign |
Ø |
Ø |
Ø |
width="130"Capital O, slash |
U |
Ù |
Ù |
Capital U, grave accent |
U |
Ú |
Ú |
Capital U, acute accent |
U |
Û |
Û |
Capital U, circumflex accent |
U |
Ü |
Ü |
Capital U, dieresis or umlaut mark |
Y |
Ý |
Ý |
Capital Y, acute accent |
Þ |
Þ |
Þ |
Capital Thorn, Icelandic |
ß |
ß |
ß |
Small sharp s, German (sz ligature) |
a |
à |
à |
Small a, grave accent |
a |
á |
á |
Small a, acute accent |
a |
â |
â |
Small a, circumflex accent |
a |
ã |
ã |
Small a, tilde |
a |
ä |
ä |
Small a, dieresis or umlaut mark |
a |
å |
å |
Small a, ring |
æ |
æ |
æ |
Small ae diphthong (ligature) |
c |
ç |
ç |
Small c, cedilla |
e |
è |
è |
Small e, grave accent |
e |
é |
é |
Small e, acute accent |
e |
ê |
ê |
Small e, circumflex accent |
e |
ë |
ë |
Small e, dieresis or umlaut mark |
i |
ì |
ì |
Small i, grave accent |
i |
í |
í |
Small i, acute accent |
i |
î |
î |
Small i, circumflex accent |
i |
ï |
ï |
Small i, dieresis or umlaut mark |
ð |
ð |
ð |
Small eth, Icelandic |
n |
ñ |
ñ |
Small n, tilde |
o |
ò |
ò |
Small o, grave accent |
o |
ó |
ó |
Small o, acute accent |
o |
ô |
ô |
Small o, circumflex accent |
o |
õ |
õ |
Small o, tilde |
o |
ö |
ö |
Small o, dieresis or umlaut mark |
÷ |
÷ |
÷ |
Division sign |
ø |
ø |
ø |
Small o, slash |
u |
ù |
ù |
Small u, grave accent |
u |
ú |
ú |
Small u, acute accent |
u |
û |
û |
Small u, circumflex accent |
u |
ü |
ü |
Small u, dieresis or umlaut mark |
y |
ý |
ý |
Small y, acute accent |
þ |
þ |
þ |
Small thorn, Icelandic |
y |
ÿ |
ÿ |
Small y, dieresis or umlaut mark |
'프로그래밍 > 기타 등등' 카테고리의 다른 글
이미지 사이즈를 줄여서 홈페이지에 업로드하기 (0) | 2009.10.16 |
---|---|
언어(ISO 639) 코드 (0) | 2009.09.29 |
네이버 스마트에디터, 다음 오픈에디터 (0) | 2009.09.25 |
[펌] [CSS] IE6리하 PNG 투명값처리 소스들.. (0) | 2009.08.06 |
[펌][CSS] PNG 포멧 용법 (0) | 2009.08.06 |
다운로드->>http://www.twinhelix.com/css/iepngfix/iepngfix.zip
다운로드
blank.gif와 iepngfix.htc파일을 원하는경로에 놔둡니다.(단 blank.gif 경로에따라 iepngfix.htc에서 경로바꿔야 하는듯)
CSS에 behavior: url(iepngfix.htc); 추가
문제점: 내부에 하이퍼링크(<a href~~~></a>)가 있는경우 IEPNGFix:Childeren of posioned element are unclickable이라고 에러가뜸
1.다운로드
1.다운로드
여제
TAG
<ul id="test"><li><a href="#">sdsd</a></li></ul>
CSS
#test{ position:relative; left:100px; top:100px; behavior: url(iepngfix.htc); background: #fcc url(image/pic.png) no-repeat 0 0;height:250px; width:250px;}
2)unit-png-fix (http://labs.unitinteractive.com/unitpngfix.php)
다운로드->>http://labs.unitinteractive.com/downloads/unitpngfix.zip
다운로드
clear.gif와 unitpngfix.js파일을 원하는경로에 놔둡니다.(역시 clear.gif ,unitpngfix.js 경로지정 주의)
태그에<!--[if lt IE 7]>
<script type="text/javascript" src="unitpngfix.js"></script>
<![endif]-->추가
문제점: CSS의 포지션지정,z-index 증 몇몇이 안먹힘 불가.....
예제
<head>
<title>무제 문서</title>
<!--[if lt IE 7]>
<script type="text/javascript" src="unitpngfix.js"></script>
<![endif]-->
<style type="text/css">
#test{ position:relative; left:100px; top:100px; background: #fcc url(image/05mainnavi.png) no-repeat 0 0;height:250px;
</style>
</head>
<body>
<ul id="test"><li><a href="#">sdsd</a></li></ul>
</body>
3)DD_belatedPNG.fix(http://www.dillerdesign.com/experiment/DD_belatedPNG/)
다운로드->>http://www.dillerdesign.com/experiment/DD_belatedPNG/DD_belatedPNG_0.0.7a.js
다운로드
clear.gif와 unitpngfix.js파일을 원하는경로에 놔둡니다.(역시 clear.gif ,unitpngfix.js 경로지정 주의)
html에<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
DD_belatedPNG.fix('#test')
</script>
<![endif]--> 가
위예제 #test와 같이 사용할한 선택자(id 또는 class 또는 tag)를 지정
문제점: 몇몇에 태그에 먹히지않음 body,tr,td,input
예제
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
DD_belatedPNG.fix('#test');
</script>
<![endif]-->
</head>
<style type="text/css">
#wrap{ position:relative;}
#test{ position:relative; left:100px; top:100px; background: #fcc url(image/05mainnavi.png) no-repeat 0 0;height:250px; width:250px;}
</style>
<body>
<div id="wrap">
<ul id="test"><li><a href="#">sdsd</a></li></ul>
</div>
</body>
단! 포지션 지정을 위해선 위와같이 바깥에 하나더 감싸줄 필요가 있슴..위 예제는 #test에 #wrap로 감싸준것.
CSS와 알파값을 제대로 사용하기위한 몇몇 방법이였습니다.. 그나마 마지막이 CSS지정을 거의 다할수 있는데 각기 여러문제가 많군요. 다른좋은 방법이 있다면 좋은데..불필요한 마크업이 들어가는건 어쩔수 없는것인지 ㅠㅠ
[출처] IE6리하 PNG 투명값처리 소스들.. (웹디들의커뮤니티카페 :: Dom FAM ::) |작성자 샷타이거
'프로그래밍 > 기타 등등' 카테고리의 다른 글
이미지 사이즈를 줄여서 홈페이지에 업로드하기 (0) | 2009.10.16 |
---|---|
언어(ISO 639) 코드 (0) | 2009.09.29 |
네이버 스마트에디터, 다음 오픈에디터 (0) | 2009.09.25 |
HTML 특수문자코드표 (0) | 2009.08.07 |
[펌][CSS] PNG 포멧 용법 (0) | 2009.08.06 |
CSS/JS
가장 많이 알려져 있는 방법으로 인터넷 익스플로어의 필터속성을 이용하여 png의 투명/반투명 효과를 만들어준다. 자바스크립트로 작성된 png를 투명하게 처리해주는 스크립트를 작성하고, 이를 stylesheet에서 호출하는 방식이다. 하지만 이 방법의 경우 IMG Element에서만 적용할수 있다는 단점이 있고, 투명 배경 처리를 위해서는 .bgIE6과 같이 별도의 스타일을 지정해줘야 한다.
Stylesheet
.png24 { tmp:expression(setPng24(this)); }
Javascript
function setPng24(obj)
{
obj.width = obj.height = 1;
obj.className = obj.className.replace(/\bpng24\b/i,'');
obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+ obj.src +"',sizingMethod='image');"
obj.src = '';
return '';
}
배경처리를 위한 추가코드
IE6에서 투명 배경을 처리하기 위해서는 아래와 같이 style문서안에 IE6을 위한 별도의 스타일을 지정하거나, HTML문서 Head Element안에 Hack을 이용한 방법으로 처리해야 한다.
방법1
.bg { width: 114px; height: 60px; background: url('img_logo.png') no-repeat 0 0; }
* html .bg { background-image : none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img_logo.png',sizingMethod='scale'); }
위 방법은 .bg에서 png배경을 기본값으로 배경에 설정한 것이고, 다시 * html 핵을 사용해서 IE6에만 배경을 재설정한 것이다.
방법2
<head>
<!--[if IE]>
<style type="text/css">
.bg {
background-image : none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img_logo.png',sizingMethod='scale');
}
</style>
<![endif]-->
</head>
위 방법은 스타일 문서에 정의하지 않고, HTML문서 내에 직접 작성할때 사용하는 것으로, <--[if IE]> 와 <![endif]-->를 이용한 핵을 사용한다.
HTC
Stylesheet
.iePngFix {behavior:url(iepngfix.htc);}
HTC
이 방법은 twinhelix에서 확인해볼수 있는 방법인데 이미지 앨리먼트와 배경을 동시에 처리할 수 있고, 스타일 문서에 별도의 핵을 사용하지 않아도 된다. 아울러 IE5.5 이상의 익스플로어에서 적용 가능하여, 위의 방법보다는 권장할 수 있는 방법이라고 생각됩니다. 또한, 애플등의 사이트에서도 적용하여 사용하는 것으로 보아 심각한 문제를 일으키지는 않는것으로 보입니다.(나라디자인 참조 문서 확인)
<public:component>
<public:attach event="onpropertychange" onevent="doFix()" />
<script type="text/javascript">
// IE5.5+ PNG Alpha Fix v1.0RC4
// (c) 2004-2005 Angus Turnbull http://www.twinhelix.com
// This is licensed under the CC-GNU LGPL, version 2.1 or later.
// For details, see: http://creativecommons.org/licenses/LGPL/2.1/
// This must be a path to a blank image. That's all the configuration you need.
if (typeof blankImg == 'undefined') var blankImg = 'blank.gif'; // 1x1px 짜리 투명 이미지(blank.gif)의 경로를 변경.
var f = 'DXImageTransform.Microsoft.AlphaImageLoader';
function filt(s, m)
{
if (filters[f])
{
filters[f].enabled = s ? true : false;
if (s) with (filters[f]) { src = s; sizingMethod = m }
}
else if (s) style.filter = 'progid:'+f+'(src="'+s+'",sizingMethod="'+m+'")';
}
function doFix()
{
// Assume IE7 is OK.
if (!/MSIE (5\.5|6\.)/.test(navigator.userAgent) ||
(event && !/(background|src)/.test(event.propertyName))) return;
var bgImg = currentStyle.backgroundImage || style.backgroundImage;
if (tagName == 'IMG')
{
if ((/\.png$/i).test(src))
{
if (currentStyle.width == 'auto' && currentStyle.height == 'auto')
style.width = offsetWidth + 'px';
filt(src, 'scale');
// 'scale' 을 'image' 으로 변경하면 padding 적용시 나타나는 이미지 크기의 변화(잘못된 렌더링)를 방지할 수 있다. 하지만 border 표현에 문제가 생긴다.
src = blankImg;
}
else if (src.indexOf(blankImg) < 0) filt();
}
else if (bgImg && bgImg != 'none')
{
if (bgImg.match(/^url[("']+(.*\.png)[)"']+$/i))
{
var s = RegExp.$1;
if (currentStyle.width == 'auto' && currentStyle.height == 'auto')
style.width = offsetWidth + 'px';
style.backgroundImage = 'none';
filt(s, 'crop');
// IE link fix.
for (var n = 0; n < childNodes.length; n++)
if (childNodes[n].style) childNodes[n].style.position = 'relative';
}
else filt();
}
}
doFix();
</script>
</public:component>
참고링크
본 내용은 이미 인터넷에 여러번 올라온 내용을 재탕하고자 한 것은 아니고, 제가 참여하는 스터디모임에서 사용할 목적으로 작성된 것입니다. png의 개념과 HTC사용과 관련한 문제와 설명은 아래 나라디자인에서 한번더 확인해보시면 좋을것 같습니다.
'프로그래밍 > 기타 등등' 카테고리의 다른 글
이미지 사이즈를 줄여서 홈페이지에 업로드하기 (0) | 2009.10.16 |
---|---|
언어(ISO 639) 코드 (0) | 2009.09.29 |
네이버 스마트에디터, 다음 오픈에디터 (0) | 2009.09.25 |
HTML 특수문자코드표 (0) | 2009.08.07 |
[펌] [CSS] IE6리하 PNG 투명값처리 소스들.. (0) | 2009.08.06 |