XHTML및 HTML 4.01부터 사용 불가능한 태그 :
center, s, strike, u 등이 있습니다.

center의 대책!..
CSS로 바꾸어 씁니다.
text-align: center;

s의 대책!..[strike 포함]
CSS로 바꾸어 씁니다.
text-decoration: line-through;

u의 대책!..
CSS로 바꾸어 씁니다.
text-decoration: underline;

++
윗줄을 한번 쳐봅시다~^^..
text-decoration: overline;

윗줄 밑줄을 동시에 치려면?
text-decoration: overline underline;
?죠?^^..


가장 오해하는 몇가지!...
blockquote는, 들여쓰기 할때 쓴다? 도대체 누가 그런 발상을 -_-;
이렇게 쓰시는 분들.. 모두 아니 무조건 반성하십시요.

blockquote의 쓰임을 아시는 지요.. 바로 인용문을 나타낼때 사용하는 겁니다.
즉, 어떠한 글을 인용하거나 할때 blockquote를 사용해서 알려주지죠.

그런데 어떻게 이것을 들여쓰기용으로 사용하시는 지..
text-indent: 1em;
이렇게 하시면 한글자 들여쓰기 됩니다.

비표준 속성-_-;;;;;;;;;
cursor: hand;
이거 표준아닙니다. FF에서 보면 이거 잘못되었다고 나오고요.
표준은, hand가 아닌, pointer입니다. IE에서 이상한 것만 만들어 내서 원..


그리고, 태그를 쓸적에.. 대/소문자 구문안한다고 했는데요.
XHTML넘어와서는 무조건!.. 소문자로 써주셔야 합니다.
속성은 모두 "등으로 묶어주고요~
by Anna 안나 2008. 7. 29. 16:19
보통 CSS를 사용하면 파폭, 사파리, 오페라에서는 잘 보이는데 IE에서는 깨진다거나 IE7까지는 맞출 수 있지만 IE6까지 맞출 방법이 없다거나 그렇다고 IE6에다 맞추면 다른 브라우저에서 전부 깨져보인다던가 하는 난감한 일이 발생합니다. 그런 경우를 위한 팁을 적어보겠습니다.

***HTML명령어 if IE 와 COMMENT***

if IE와 COMMENT가 무엇인가요?

두 명령어는 익스플로러에서만 지원하는 특수 명령어입니다. 다만 if IE는 웹표준 검사 시에 주석으로 인식 되어 통과가 되지만 comment는 비표준 태그에 해당하기 때문에 얄짤없이 테스트에 탈락하게 되니 웹표준 테스트에 신경을 쓰시는 분이라면 다른 종류의 방법. 이를테면 CSS핵 등을 사용하시길 권해 드립니다.

if IE는 HTML코드 사이에 IE에서만 작동하는 코드를 포함시킬 수 있는 명령어입니다. 기본적으로 주석의 형태를 가지고 있기 때문에 다른 브라우저에서는 이 명령어가 포함된 문장은 실행이 되지 않습니다. if IE가 더욱 마음에 드는 점이라면 익스플로러의 버전별로 다 명령어를 설정해 줄 수 있다는 것이지요.

COMMENT는 if IE와는 반대 되는 성격을 가진 명령어입니다. if IE가 쓰인 행이 IE에서만 인식이 되고 기타 브라우저에서는 주석으로 인식해서 비활성 처리가 되는 것에 반해 COMMENT는 IE 전용 주석 설정태그로써 이 태그가 사용된 행은 IE에서는 주석으로 인식되지만 기타 브라우저에서는 COMMENT를 비표준 태그로 인식해서 COMMENT 안에 들어간 내용을 전부 실행해 버리지요.

어떻게 사용하나요?

if IE 명령어는 이런 식으로 사용합니다.
<!--[if IE]>

IE 유저에게만 표시할 내용

<![endif]-->

IE에서만 실행 할 내용.


버전별로 따로 설정을 할 수도 있습니다.
<!--[if IE 6]>
IE6 유저에게만 표시할 내용
<![endif]-->

같은 방법으로 <!--[if IE 7]>이라고 하면 IE7 유저에게만 보이겠지요?


comment 명령어의 사용법은 더 쉽습니다.
<comment>
기타 브라우저 사용자에게만 표시할 내용
</comment>

실제로 사용되는 사례를 가르쳐 주세요.

각 브라우저 별로 전혀 다른 페이지를 보여주는 것도 물론 가능하기는 합니다만 저는 각 브라우저별로 다른 CSS를 사용하는 데에 많이 사용합니다.

이를테면 이런 경우입니다.
<style>
.test { font-weight:bold; }
.test_IE6 { text-decoration:underline; }
.test_IE7 { color:#CCCCCC; }
</style>

<html>

<!--[if IE 6]>
<div class = "test_IE6">
<![endif]-->

<!--[if IE 7]>
<div class = "test_IE7">
<![endif]-->

<comment>
<div class = "test">
</comment>

이 글자가 어떻게 보이십니까?
</div>

</html>



이 코드를 브라우저 별로 실행시켜 보시면 IE6에선 밑줄이, IE7에서는 글씨가 회색으로, 파이어폭스 등 기타 브라우저에서는 글씨가 굵게 보일겁니다. 이런 식으로 브라우저별로 다른 CSS를 설정해 줄 수가 있는 것이지요. 그 중에서도 버그 상습범인 IE는 이런 식으로 CSS 클래스 자체를 다르게 주어서 격리를 시키는 것이 최고이지요.
참고할만한 사이트 : http://www.quirksmode.org/css/condcom.html
by Anna 안나 2008. 7. 29. 16:17
Red #FFF7F7 #FEF8F8 #FDF9F9 #FCF9F9 #FFECEC #FCEEEE #FAF1F1 #F9F2F2 #FFCCCC #F8D2D2 #F2D9D9 #EFDCDC #FF9999 #F2A6A6 #E5B2B2 #DEB8B8 #FF6666 #EC7979 #D88C8C #CE9595 #FF3333 #E54C4C #CC6666 #BF7373 #FF0000 #DF2020 #BF4040 #AF5050 #E60000 #C91D1D #AC3939 #9D4747 #CC0000 #B21919 #993333 #8C4040 #B30000 #9C1616 #862D2D #7B3838 #990000 #861313 #722626 #682F2F #660000 #590D0D #4C1919 #451F1F #4D0000 #430909 #391313 #341818 #340000 #2D0606 #270D0D #231010 #270000 #220505 #1D0A0A #1A0C0C OrangeRed #FFFCFB #FEFCFB #FEFCFC #FDFCFC #FFF8F6 #FDF9F7 #FCF9F8 #FBF9F9 #FFEDE9 #FCEFEC #F9F0EE #F6F2F1 #FFDCD4 #F8DED9 #F4E3DF #EFE6E4 #FFC4B7 #F5C9C0 #EDCFC9 #E4D5D2 #FFAB98 #F0B3A5 #E5BBB2 #D8C3BE #FF967E #EDA08F #DEAA9E #CEB4AE #FF6947 #E5785F #D18675 #BA948C #FF4419 #DF5738 #C56852 #A87A6F #FF3000 #DC4522 #BF5840 9F6B5F #E62B00 #C63E1F #AC4F39 #8F6156 #B82200 #9E3118 #8A3F2E #734D45 #931B00 #7E2713 #6E3225 #5C3E37 #671300 #581B0D #4D231A #402B26 #581000 #4C180C #421E16 #372521 #3E0B00 #361008 #2E140F #261A17 Orange #FFFDFA #FEFCFA #FDFCFB #FDFDFC #FFF7EF #FDF7F1 #FBF7F3 #F9F7F5 #FFEBD8 #FAEBDD #F5EBE2 #F0EBE6 #FFD7B2 #F5D7BB #EBD7C5 #E2D8CF #FFCE9F #F3CEAB #E7CEB7 #DBCFC3 #FFBD7E #EFBD8E #DEBD9E #CEBEAE #FFA147 #E8A15E #D1A275 #BAA28C #FF8A19 #E28A36 #C58A52 #A88B6F #FF7E00 #DF7E20 #BF7F40 #9F7E5F #E87100 #CA711D #AD733A #917357 #CC6400 #B2641A #986433 #7F654C #AB5300 #955315 #80542B #6B5540 #813E00 #713F10 #603F20 #503F30 #5B2C00 #4F2C0B #442D17 #392D22 #3B1D00 #331C07 #2C1D0F #251D16 #231100 #1E1104 #1A1109 #16110D Gold #FFFCF2 #FBFAF5 #FBFAF5 #FAF9F7 #FFF9E7 #F9F6ED #F9F6ED #F6F4F0 #FFF5D9 #FAF3DE #F5F0E2 #F0EEE7 #FFEFBF #F7EBC7 #EFE7CF #E7E3D7 #FFE69D #F2DFA9 #E6D9B5 #DAD4C2 #FFDC74 #EDD385 #DCCA97 #CBC2A8 #FFD047 #E8C45E #D1B975 #BAAE8C #FFC519 #E2B636 #C5A852 #A89A6F #FFC000 #DFAF20 #BF9F40 #9F8F5F #F3B600 #D4A61E #B6973D #98895B #DBA300 #BF951B #A48837 #897B52 #BA8B00 #A27F17 #8B732E #746846 #956F00 #826512 #6F5C25 #5D5338 #705400 #624D0E #54461C #463F2A #4F3B00 #45360A #3B3114 #312C1D #332600 #2C2206 #26200D #201D13 Yellow #FFFEF8 #FEFDF9 #FDFDFA #FCFCFA #FFFDEF #FDFBF1 #FBFAF3 #F9F8F5 #FFFCE0 #FBF9E4 #F7F5E8 #F3F2EB #FFFAC7 #F8F4CE #F1EED5 #EAE9DC #FFF7A2 #F3EFAD #E7E3B9 #DCDAC5 #FFF270 #EDE382 #DBD494 #C9C6A5 #FFED33 #E5D74C #CCC366 #B2AD7F #FFEA00 #DFCF20 #BFB440 #9F995F #E6D200 #C9BA1D #ACA239 #8F8A56 #C4B200 #AB9D18 #938A31 #7A7549 #9D8E00 #897D13 #756D27 #625E3B #766A00 #675E0F #58521D #49462C #554C00 #4A430A #3F3A15 #353320 #3C3500 #342F07 #2D290F #252316 #272300 #221F05 #1D1B0A #18170E #220013 #141203 #111006 #0E0D08 YellowGreen #F8FCF3 #F8FBF4 #F7F9F5 #F7F8F6 #F2F9E8 #F2F7EA #F1F4EC #F0F2EE #E8F5D5 #E7F1D9 #E6EDDD #E6E9E1 #D9EFB9 #D8E8C0 #D8E8C0 #D5DACD #C4E693 #C2DB9D #C0D1A8 #BEC7B2 #ABDC65 #A8CD74 #A6BE83 #A3AF91 #90D133 #8CBD47 #88A95A #85956E #74C600 #6FAD19 #6B9431 #677B4A #69B319 #659C16 #61862D #5D7043 #61A500 #5D9014 #597B29 #56673E #549000 #517E12 #4E6C24 #4B5A36 #457700 #42680F #40591E #3D4A2C #355C00 #33500B #314517 #2F3922 #264200 #233908 #233110 #222919 #192C00 #182605 #17210B #161B10 #0F1A00 #0E1603 #0D1306 #0D100A Green #F7FAF6 #F7F9F6 #F7F9F7 #F7F8F7 #ECF5EB #EDF3EC #EEF2ED #EFF1EF #DFEEDD #E1ECDF #E2E9E1 #E3E7E3 #CBE4C9 #CDE0CC #D1DDD0 #D4DAD3 #B3D7B0 #B7D2B5 #BBCDBA #BFC8BE #96C792 #9BC098 #A1B99F #A7B3A6 #75B570 #7CAC78 #83A381 #8B9B8A #52A34C #5C9857 #658D62 #6E826C #2D8F26 #388233 #437440 #4F674D #087B00 #156B0F #235C1F #304D2E #076900 #125C0D #1D4E1A #294127 #065400 #0E490A #183F15 #20341F #054100 #0C3908 #123010 #192818 #043100 #092B06 #0E240C #131E12 #032200 #061D04 #0A1908 #0E150D #021600 #041303 #061005 #080D08 Teal #F9FCFC #F9FBFB #FAFBFB #FAFBFB #F2F8F8 #F3F7F7 #F3F6F6 #F4F5F5 #E7F2F1 #E8F0EF #EAEFEF #EBEEEE #D6E9E7 #D8E6E4 #DBE4E3 #DDE2E1 #BDDCD9 #C1D8D6 #C5D4D2 #C8D0CF #9ECCC7 #A4C6C2 #A9C0BD #AFBAB9 #79B9B1 #81B1AB #89A9A5 #91A19F #51A59A #5B9A92 #66908A #708582 #268F81 #338277 #40746D #4D6763 #006F61 #0E6156 #1C534C #294541 #006054 #0C544B #184842 #243C39 #005147 #0A473F #143C37 #1E322F #00433A #083A33 #11322D #192A28 #00342D #062D28 #0D2723 #13201E #002722 #05221E #0A1D1A #0E1817 #001B18 #031715 #071413 #0A1110 DarkCyan #F0F5F5 #F0F4F4 #F1F3F3 #F2F3F3 #E6EFEF #E7EEEE #E8ECEC #E9EBEB #D8E6E7 #DAE4E5 #DCE3E3 #DDE1E1 #C6DBDC #C9D8D9 #CBD5D6 #CED3D3 #AFCCCE #B3C8CA #B7C5C6 #BAC1C2 #93BABD #98B5B7 #9DB0B2 #A3ACAD #74A6AB #7BA0A4 #829A9D #889596 #549198 #5C8A8F #658387 #6D7C7E #347C85 #3E747B #486B70 #526466 #196B75 #246169 #30595E #3B4F52 #005B66 #0D5159 #19464C #263C3F #00525C #0B4850 #174045 #223639 #00464E #0A3E44 #13363A #1D2E30 #00383E #083136 #0F2B2E #172426 #002A2F #062529 #0C2023 #111C1D #001D21 #041A1D #081618 #0C1314 SkyBlue #F6FCFF #F7FCFE #F8FBFC #F9FAFB #EDF9FF #EFF8FC #F1F7FA #F4F7F8 #E0F4FF #E4F3FB #E8F2F7 #EBF0F3 #CEEEFF #D4ECF9 #DAEAF2 #E0E8EC #B3E5FF #BCE1F5 #C6DFEC #CFDBE2 #90D9FF #9ED4F1 #ACD0E3 #B9CBD5 #65CBFF #78C4EB #8BBED8 #9FB8C5 #33BAFF #4CB1E5 #66A9CC #7FA1B2 #00A0F3 #1E95D4 #3D8CB6 #5B8398 #0092E0 #1C89C4 #3881A8 #54788C #0080C6 #1978AD #317194 #4A6A7B #006CA7 #156692 #2A5F7D #3E5968 #00588A #115378 #224E67 #344A56 #00456C #0D415E #1B3D51 #283943 #00324E #0A2F44 #132C3A #1D2930 #002235 #06202E #0D1E27 #141C21 Blue #F7FAFF #F8FAFE #F9FAFD #FAFBFC #F1F6FF #F3F7FD #F4F6FB #F6F7F9 #E7F0FF #EAF1FC #EDF1F9 #F0F2F6 #D9E7FF #DEE8FA #E2E9F5 #E7EAF0 #C4DAFF #CBDBF7 #D3DEF0 #DAE0E9 #A8C9FF #B3CCF4 #BECEE9 #C8D0DE #85B3FF #94B6EF #A3BAE0 #B3BED1 #5B98FF #6F9DEA #84A2D6 #98A7C1 #2D7CFF #4782E4 #6188CA #7C8FB0 #0060FF #2068DF #4070BF #5F779F #0056E6 #1D5DC9 #3964AC #566B8F #0049C4 #184FAB #315593 #495B7A #003A9D #133E89 #274475 #3B4962 #002C76 #0F3067 #1D3358 #2C3749 #001F53 #0A2148 #15243E #1F2734 #001436 #07162F #0D1D28 #141921 MediumBlue #F8F8FD #F8F8FC #F9F9FB #FAFAFB #F3F3FB #F4F4FA #F5F5F9 #F6F6F8 #EBEBF9 #EDEDF7 #EEEEF5 #F0F0F3 #E1E1F6 #E3E3F3 #E6E6F0 #E9E9EE #D3D3F2 #D7D7EE #DBDBEA #DEDEE6 #C1C1ED #C6C6E7 #CCCCE2 #D1D1DC #ABABE7 #B2B2DF #BABAD8 #C1C1D0 #8F8FDF #9999D5 #A3A3CB #ADADC1 #6F6FD6 #7C7CC9 #8989BC #9595AF #4B4BCC #5B5BBC #6B6BAB #7B7B9B #2626C2 #3939AE #4D4D9B #606087 #2222AF #33339D #45458B #57577A #1C1C90 #2A2A81 #393973 #474764 #16166F #212164 #2C2C58 #37374D #101050 #181848 #202040 #282838 #0A0A34 #0F0F2E #141429 #1A1A24 BlueViolet #FAF8FE #FAF9FD #FAFAFC #FBFAFC #F3EDFC #F3EFFA #F4F2F6 #F4F2F6 #EBE2FA #ECE5F7 #ECE8F4 #EDEBF1 #E1D4F7 #E2D8F2 #E3DDEE #E4E1EA #D4C2F3 #D6C8ED #D7CEE6 #D8D4E0 #C3ABEE #C5B3E5 #C8BCDD #CAC4D5 #AF8FE8 #B29ADD #B5A5D1 #B8B0C6 #9970E1 #9D7ED3 #A08CC4 #A49AB6 #804CD9 #845DC7 #896FB5 #8E81A4 #6526D1 #6A3BBB #7051A6 #766691 #4B00C9 #5119B0 #573296 #5E4B7D #3E00A7 #431592 #492A7D #4E3E68 #300081 #341071 #382060 #3C3050 #23005D #250B51 #281745 #2C233A #190041 #1B0839 #1C1030 #1E1828 #10002A #110524 #120A1F #14101A Purple #FAF8FC #F9F8FB #FAF9FB #F9F9FA #F6F2F9 #F6F3F8 #F6F4F7 #F5F4F6 #F0E9F5 #EFEAF3 #EFECF2 #EFEDF0 #E7DCEF #E6DEEC #E6E1EA #E6E3E8 #DACAE6 #D9CDE2 #D9D1DF #D8D4DB #CAB2DB #C9B7D6 #C8BCD0 #C7C1CB #B594CD #B49BC6 #B2A2BE #B1A9B7 #9D71BD #9B7AB3 #9A84AA #988DA0 #834CAC #8158A0 #7F6494 #7E7088 #68269A #65348B #64437D #61516E #4D0088 #4A1177 #4A1177 #463355 #420074 #3F0E65 #3E1D57 #3B2B48 #35005D #330B51 #311745 #30233A #260043 #24083A #241132 #23192A #19002D #180527 #170B21 #17111C #0E0019 #0E0316 #0D0612 #0C090F Fuchsia #FFF6FE #FEF7FD #FCF8FC #FBF9FB #FFEEFE #FDF0FC #FAF2F9 #F8F4F8 #FFE2FE #FBE5FA #F7E9F6 #F4EDF4 #FFD1FD #F9D7F7 #F3DCF2 #EDE2EC #FFB9FC #F6C2F4 #EDCAEB #E4D3E3 #FF99FA #F2A6EE #E5B2E2 #D8BFD7 #FF71F8 #ED83E7 #DB94D7 #C9A6C7 #FF3FF7 #E757E0 #CF6FCA #B787B5 #FF00F6 #DF20D8 #BF40BA #9F5F9C #E600DD #C91DC2 #AC39A7 #8F568D #BD00B6 #A5179F #8D2F89 #764774 #9C0095 #881383 #752771 #613A5F #7A0073 #6A0F64 #5B1E57 #4C2E4A #590054 #4E0B4A #42163F #372136 #3E003B #360834 #2E0F2C #261725 #270025 #220520 #1D0A1C #180E17 DeepPink #FFF5FA #FDF6F9 #FCF7F9 #FBF9FA #FFE8F5 #FCEBF5 #F9EEF4 #F6F0F3 #FFD6ED #FADBEC #F4E0EB #EFE5EB #FFBEE2 #F7C6E1 #EECEE0 #E6D6DF #FFA2D6 #F3ADD4 #E7B9D3 #DCC5D2 #FF82C8 #EF91C6 #DFA1C4 #D0B1C2 #FF59B6 #EA6EB3 #D582B0 #C097AE #FF2DA4 #E447A0 #CA619C #B07C99 #FF0090 #DF208B #BF4087 #9F5F83 #E60081 #C91D7D #AC3979 #8F5676 #C4006D #AB186A #933167 #7A4964 #A1005A #8D1458 #782855 #643C52 #7C0046 #6C0F43 #5D1F42 #4D2E3F #590033 #4E0B31 #42162F #37212E #3A0021 #32071F #2B0E1E #24161E #220013 #1D0412 #190811 #150D11 BlackSilverWhite #FFFFFF #FBFBFB #F8F8F8 #F4F4F4 #EEEEEE #E5E5E5 #DDDDDD #D0D0D0 #C0C0C0 #ADADAD #989898 #808080 #666666 #4B4B4B #262626 #000000 http://naradesign.net/wp/2006/09/06/37/

'디자인 > color' 카테고리의 다른 글

다양한 색상표  (0) 2008.10.17
선호색에 따른 HTML 배색표  (0) 2008.07.29
느낌에 따른 HTML 배색표  (0) 2008.07.29
by Anna 안나 2008. 7. 29. 16:08
빨강(Red) 초록(Green) 파랑(blue) 청록(Cyan) 자홍(Fuchsia) 노랑(Yellow) 빨강 : 난색계열, 태양, 불꽃, 열정, 위험 유사색상, 유사톤의 조화 #CC3333 #FF9999 #FFFFCC #990000 #CC6633 #FFCC99 #FF6666 #FF9966 #FFCCCC #CC0000 #FFCC33 #CCCC99 #FF3333 #FFCC66 #FFFFCC #FF9999 #99FFCC #FFFF99 #FF3333 #CCCC33 #CC9933 #FF3333 #FF99CC #FFFFFF #FF9999 #CC99CC #CCCCCC #996666 #666699 #999966 #FF0000 #FF9999 #FFFFFF #660000 #CC6666 #FFCCCC 대조, 대비의 조화 #FF6666 #99CC66 #FFFF99 #993333 #CC99CC #CCCC99 #CC6666 #9999CC #CCCCFF #CC3333 #99CC99 #FFFFCC #CC9999 #669999 #99CCCC #CC0000 #66CCCC #FFFFCC #FF0000 #666633 #CCCC99 #330000 #FF9933 #999966 #CC3333 #663399 #CCCC99 #996666 #669966 #FFFFCC #CC9999 #99CC99 #CCCC99 #993333 #66CCCC #CCCCCC 초록 : 한색계열, 풀, 어린 잎사귀, 산뜻한, 평화 유사색상, 유사톤의 조화 #339933 #99CC66 #FFFF99 #669966 #99CC99 #CCCC66 #003300 #669933 #CCCC99 #339933 #CCCC33 #CC9933 #339933 #99CC00 #FFFFCC #99CC99 #CC9999 #CCCC99 #CCFF99 #FF9999 #FFFF99 #66CC66 #66CC99 #CCFFCC #339933 #666633 #CCCC66 #669966 #666699 #996699 #006600 #66CC66 #CCFF99 #003300 #669966 #999966 대조, 대비의 조화 #00CC00 #0066CC #99CCFF #99CC99 #CC9966 #FFCC99 #336633 #663333 #CCCC99 #99FF99 #CCCCFF #FFFFCC #66CC66 #CC99CC #CCFFCC #336633 #993366 #CCCC99 #339933 #CCFF99 #99CCFF #003300 #FFCC33 #FFFFCC #339933 #996600 #CC9933 #33CC33 #6666CC #FFFFFF #339933 #CC9966 #FFFFCC #669966 #CC6699 #FFCCFF 파랑 : 한색계열, 정갈함, 차가움, 하늘, 바다 유사색상, 유사톤의 조화 #3333CC #9999FF #CCCCFF #0000FF #6699FF #CCFFFF #000066 #663399 #9999CC #333399 #99CCCC #FFFFCC #6666FF #FF99FF #FFFFCC #6666FF #66CCFF #CCFF66 #6633CC #CC3333 #CCCC33 #3333CC #6699CC #99CCFF #3333FF #66CCFF #FFFFFF #666699 #669966 #999966 #000066 #6666FF #CCCCCC #333399 #9999CC #FFFFFF 대조, 대비의 조화 #9999CC #66CC99 #FFFFCC #3333CC #00CC99 #CCFFCC #6666CC #FF9966 #FFFF99 #6666FF #FF6699 #FFCCCC #9999FF #FFCC33 #FFFFCC #666699 #999966 #CCCC99 #000099 #99CCFF #CCFFFF #333366 #CC99CC #FFFFCC #6666FF #CC6699 #FFCCCC #333366 #99CC99 #999999 #333399 #CCCCFF #CC99CC #666699 #CCCC00 #99CC99 청록 : 한색계열, 초록빛을 띈 파랑, 산뜻한, 차가운 유사색상, 유사톤의 조화 #00CCCC #99CCCC #CCFFFF #009999 #66CC99 #CCFFCC #33CCCC #99CCFF #FFFFCC #66FFFF #66CCFF #CCFFFF #336666 #9999CC #CCCCFF #66CCCC #6666CC #CCCC66 #99FFFF #9999FF #FFFFCC #00CCCC #0066CC #FFFFFF #339999 #666699 #CCCCCC #99CCCC #9999CC #CCCC99 #336666 #669999 #CCCC99 #009999 #66CCCC #CCFFFF 대조, 대비의 조화 #339999 #9966CC #CCCCFF #006666 #99CC33 #CCFFCC #66CCCC #CC99CC #FFFF99 #99CCCC #CCCC99 #FFFFCC #66CCCC #FF9933 #FFCC66 #336666 #993333 #CCCC99 #003333 #99CC99 #FFFFCC #009999 #FFFF99 #CCCC99 #00CCCC #CC99FF #CCCCCC #99FFFF #FFCCFF #FFFF99 #669999 #CCCCFF #CC99CC #009999 #FF9999 #FFFFCC 자홍 : 난색계열, 선명한 자주빛, 귀여운, 복숭아 유사색상, 유사톤의 조화 #993399 #CC66CC #FFCCFF #CC66CC #CC99FF #FFFFCC #993399 #CC6699 #FFCCCC #FF66FF #CCCCFF #FFFFCC #660066 #996666 #CC9999 #CC66CC #CCCC66 #9999CC #9966CC #66CCCC #CCCC66 #FF99FF #9966CC #CCCCFF #CC00CC #9999FF #CCCCCC #996699 #666699 #999966 #CC33CC #FF99FF #FFFFFF #663366 #996699 #CCCCFF 대조, 대비의 조화 #996699 #CC9966 #CCCC99 #CC66CC #99CCFF #FFFFCC #993399 #CCCC66 #99CCCC #660066 #669999 #CCCC99 #CC66CC #99FF99 #FFCC66 #663366 #FFFFCC #FFCCCC #663366 #CCCCFF #FFFFCC #990099 #FF99CC #FFCCCC #FF66FF #FFCC33 #CCFFCC #CC99CC #99CCCC #FFFFFF #990099 #FF9999 #FFCCFF #663366 #99CC99 #CCCC99 노랑 : 난색계열, 레몬, 명랑, 해바라기, 주의 유사색상, 유사톤의 조화 #CCCC00 #999966 #FFFFCC #FFFF99 #CCFF99 #CCCCFF #999933 #996633 #FFCC66 #CCCC66 #FF9966 #FFFFCC #FFFF66 #66CC66 #CCFF99 #CCCC66 #CC6666 #99CC66 #FFFF99 #99CCFF #99FFCC #999900 #CC9933 #FFCC99 #666600 #669966 #99CC99 #999966 #669999 #666699 #333300 #CCCC66 #FFFFFF #CCCC00 #666633 #FFFFCC 대조, 대비의 조화 #CCCC33 #CC6699 #FFCCFF #FFFF33 #00CC99 #CCFFFF #FFFF99 #99CCCC #CCFFFF #CCCC33 #CC99CC #CCCCFF #CCCC99 #6699CC #FFFFCC #999900 #666699 #FFFF99 #333300 #CC9999 #CCCC99 #666633 #99CC99 #FFFFCC #CCCC00 #339966 #99CC99 #CCCC99 #339999 #99CCCC #666600 #FFCC33 #FFFFCC #FFFF33 #99CCFF #CCCCCChttp://naradesign.net/wp/2006/09/08/58/

'디자인 > color' 카테고리의 다른 글

다양한 색상표  (0) 2008.10.17
멋지게 정리된 색상표  (0) 2008.07.29
느낌에 따른 HTML 배색표  (0) 2008.07.29
by Anna 안나 2008. 7. 29. 16:06
정갈한 여성적 발랄한 진지한 편안한 활동적 귀여운 도시적 정갈한 : 청색계에서 명도(밝기)와 채도(순도)가 높은 색을 중심으로 배색한다. #9999FF #99CCFF #FFFFFF #6666FF #33FF99 #FFFFFF #99CCFF #00FFCC #CCFFFF #6699FF #99CCFF #FFFFFF #99FF99 #66CCFF #FFFFFF #99FF99 #9999FF #CCCCFF #66CCFF #66FF99 #CCFFFF #33FFCC #6699FF #CCCCFF #66FFFF #6699FF #CCFFCC #6699FF #99CCFF #FFFFFF #99CCFF #6666FF #CCFFCC #6666FF #9999FF #99FFFF #33FF99 #6666FF #FFFFFF #66CCFF #99CCFF #CCFFCC #33FF99 #99CCFF #CCFFFF #CCCCCC #6666FF #FFFFFF #99FF99 #66CCFF #CCFFFF #9999FF #66CCFF #CCFFFF 여성적 : 빨강, 자주, 오렌지 등의 난색계열 중심으로 배색, 채도는 낮고 명도는 높게. #CC3366 #FF6699 #FFCCCC #FF66CC #CC3399 #FFCCFF #FF0099 #FF6699 #FFCCCC #FF00CC #CC66FF #FFFFFF #FF9900 #FF6699 #FFCCCC #CC66CC #FF9933 #FFFFCC #FF9900 #FF66CC #FFFFFF #FF3399 #CC66CC #FFCCFF #FF6666 #FF9933 #FFFFFF #FF0099 #FF9900 #FFFFFF #FF33CC #FF3399 #FFCCFF #FF9900 #FF66CC #FFCCCC #FF00CC #FF6666 #FFCCCC #FF33FF #CC33FF #FFCC99 #FF3399 #CC00CC #FFCCFF #FF66CC #FF0066 #FF99FF #FF6600 #FF6699 #FFFFFF #FF6666 #CC66FF #FFCC99 발랄한 : 난색과 한색계열의 대비. 빨강:초록, 오렌지:파랑, 노랑:보라 등. 채도가 높을수록 경쾌한 느낌. #FF6600 #66CC00 #FFFF99 #FF3366 #FFFF33 #FFCCCC #33FFCC #FF9999 #FFCC33 #00CC66 #FF6600 #FFFF00 #FF99CC #FF3366 #FFCC00 #CC00FF #CCFF00 #FFFF99 #FF3366 #CCFF66 #FFCCCC #FF9900 #FFFF33 #99CC33 #FFCC00 #CCFF66 #FF99CC #00CC66 #FFCC33 #99FF00 #33FFCC #FF3300 #FFFF99 #99FF00 #FF6600 #CCFFCC #FF0033 #FFFF00 #FFFFCC #FF3333 #66FF00 #CC99FF #6699FF #FF9999 #FFFF99 #99FF00 #FF3366 #FFFF33 #FF9999 #99FF00 #CCCCFF #FF9900 #FF0033 #99FF00 진지한 : 채도가 낮거나 무채색을 중심으로 배색. 남색, 파란색에 보라, 청록, 또는 회색 계열을 조합. #666666 #000066 #CCCCCC #000066 #CCCCCC #6666CC #003366 #006699 #FFFFFF #006666 #000066 #CCCCCC #000099 #6699FF #FFFFFF #330099 #666666 #FFFFFF #330000 #666699 #CCCC99 #003333 #336666 #CCCCCC #000033 #996600 #CCCC99 #0033CC #999999 #99CCFF #330099 #006666 #CCCCCC #663300 #006699 #FFFFFF #330066 #999999 #FFFFFF #330099 #CCCCCC #666699 #003333 #663300 #CCCCCC #666666 #663300 #FFFFFF #000099 #336699 #6699CC #000033 #666666 #CCCCCC 편안한 : 초록계열 중심의 배색. 녹황, 노랑과 강조색인 파랑색과의 조합. 명도 차이가 많이 나지 않도록 배색. #FF9933 #999933 #FFFF99 #99CC66 #CC9900 #FFFFCC #99CC99 #CCCC33 #CCFFCC #669933 #666633 #CCCC99 #FF9966 #996600 #FFFFCC #996633 #669933 #CCCC66 #CC9900 #669966 #FFFFCC #999933 #996633 #CCCC66 #FF6633 #CC9933 #FFFF99 #99CC66 #999900 #CCCC33 #669933 #CC6600 #FFFF99 #669966 #996600 #FFCCCC #CC6633 #996600 #CCCC99 #666600 #FF9933 #FFFFCC #666633 #CC6633 #FFCCCC #99CC33 #996600 #CCCC99 #CC6633 #996600 #FFFFCC #996600 #666633 #FFFF99 활동적 : 빨강, 초록, 노랑등 난색계열 중심으로 배색. 여기에 보색계열인 파랑이나 보라색을 조합. #330099 #FF6600 #FFFF99 #FF3300 #0099FF #FF9999 #FF6600 #009900 #FFFFCC #FFCC00 #0000CC #FFFF99 #0066FF #FF6600 #FFFFCC #009933 #FFCC00 #FF9999 #FF3366 #66CC00 #FFFF33 #0066FF #FFFF00 #CCFFCC #0099CC #FF9900 #FFFF99 #00CC33 #FF3300 #FFFF66 #0033CC #FFFF00 #CCCCFF #006600 #FF6600 #FFFF99 #FF9900 #FF3300 #FFFFCC #FF3300 #660099 #FFCC66 #330099 #FF3300 #99CCFF #000099 #009900 #FFFF33 #0099FF #FF3300 #CCFFFF #FF0000 #330099 #FFFFFF 귀여운 : 명도가 높고 연한 느낌의 밝은파랑, 하늘, 분홍. #FF6600 #6699FF #CCFFCC #6699FF #FFCC33 #CCCCFF #9999FF #FF9999 #FFFFCC #FF6633 #FF9999 #FFFF99 #FF9999 #FFCC66 #CCFF99 #9966FF #FFFF33 #FFCCCC #CCFF66 #CC99FF #FFFFCC #FF9933 #99CCFF #FFFF66 #9999FF #66FFCC #FFFF99 #FF9933 #FF6699 #FFFF99 #FF9999 #99FF99 #FFCCFF #FF99CC #FFCC33 #CCFF99 #99FF66 #66CCFF #FFFF66 #FF9933 #CC99FF #FFFF99 #9999FF #FF6699 #FFFF99 #99CCFF #99FF99 #FFCCCC #9999FF #FF9933 #FFFF99 #99CCFF #FFCC33 #FFFFCC 도시적 : 채도가 낮은 파랑, 보라, 청록 그리고 밝은회색. 액센트 컬러로 오렌지, 노랑. #333399 #9999CC #FFFFFF #3366CC #6699CC #CCCCCC #6699FF #006699 #FFFFCC #006699 #9999FF #FFFFFF #3399CC #333399 #FFFFFF #6633CC #6699CC #CCCCFF #006699 #9999FF #FFFFCC #666699 #9999FF #CCCCCC #006666 #CC99CC #FFFFCC #006699 #FFFFCC #CCCCFF #333399 #99CCCC #FFFFFF #9999FF #6666CC #FFFFCC #6699CC #333399 #FFFFFF #6699FF #3366CC #CCCCCC #CCCCCC #006699 #6699FF #3366FF #CCCCFF #FFFFFF #333399 #9999FF #CCCCCC #336699 #669999 #CCCCFF
http://naradesign.net/wp/2006/09/13/64/

'디자인 > color' 카테고리의 다른 글

다양한 색상표  (0) 2008.10.17
멋지게 정리된 색상표  (0) 2008.07.29
선호색에 따른 HTML 배색표  (0) 2008.07.29
by Anna 안나 2008. 7. 29. 16:02
페이지 스크롤에 따라서 부드럽게 움직이는 레이어. 보통 화면 상단으로 올라가는 탑버튼이나 퀵메뉴, 윙배너 구현에 사용된다. IE6, IE7, FF2, Opera9, Safari3에서 테스트 완료. 위치(position)값이 양수이면 브라우저의 상단으로 부터의 거리, 음수이면 하단으로 부터의 거리로 계산이 된다. HTML 소스 <div id="gotop">
<a href="#head" title="상단으로"><img src="/images/nav/top.gif" alt="Top"></a>
</div>
<script type="text/javascript">initMoving(document.getElementById("gotop"), 66, 66, 250);</script> 개선할점 온로드(onload)시에 적용 : 온로드 이전에 적용하면 페이지 높이가 충분하지 않아서 하단쯤에 이동이 잘 되지 않는 경우가 발생 %단위 입력 참고링크 W3C DOM Compatibility - CSS Object Model View http://hyeonseok.com/pmwiki/index.php/Javascript/SmoothMovingLayer
by Anna 안나 2008. 7. 29. 15:54
CSS에는 position:fixed 라는 속성이 존재하고 이 속성이 부여된 엘리먼트는 화면에 고정되어 스크롤을 해도 움직이지 않고 항상 같은 자리에 머물게 됩니다. 흔히 "스크롤을 따라다니는 배너" 라고 표현하는 이런 UIO(User Interface Object) 따위를 코딩할 때 이 속성을 사용할 수 있는데 보통의 경우 IE6에서 지원하지 않기 때문에 별도의 자바스크립트를 추가하여 이 기능을 구현해 왔습니다. 하지만 이제는 더이상 그럴 필요가 없을것 같습니다. 자바스크립트는 전혀 사용하지 않고 CSS Hack을 사용하여 IE6 에서 position:fixed 상태의 레이어를 구현할 수 있는 팁을 발견하였습니다. 예제 미리보기 http://naradesign.net/open_content/reference/fixedLayer/index.html CSS Code * { margin:0; padding:0;} /* html, body 사이의 간격을 제거 */
html { _overflow:hidden;} /* 기본 스크롤 제거 */
body{ _height:100%; _width:100%; _overflow:auto;} /* 대체 스크롤 생성 */
#content { width:580px; height:1000px; margin:20px; padding:10px; background:#eeeeee;}
#aside { position:fixed; _position:absolute; _z-index:-1; left:650px; top:20px; width:100px; height:300px; padding:10px; background:#dddddd;}
HTML Code <div id="content">
<h1>Fixed Layer Hack for IE6</h1>
</div>
<div id="aside">
<h2>Example</h2>
</div>
이 팁의 핵심은 <html> 요소에서 발생하는 스크롤을 제거하고 <body> 요소에 스크롤을 부여하는 것입니다. <html> 에 스크롤이 붙으면 <html> 내부의 모든 콘텐트가 스크롤과 함께 움직이지만 <body> 요소로부터 발생한 스크롤은 <html> 요소를 offset(x,y) 기준점으로 삼고있는 #aside 요소의 화면배치에 아무런 영향을 주지 않습니다. 만약 <body> 요소에 position:relative 를 주게 된다면 offset 의 기준점이 <body> 가 되기 때문에 레이어를 화면에 고정할 수 없는 상태로 다시 돌아가게 됩니다. 예제 코드에서 강조 표시된 코드가 관련 코드이며 이 팁의 내용을 더욱 자세하게 이해하고 싶으시면 관련 CSS 속성을 하나씩 제거하면서 테스트 해보시기 바랍니다. 브라우저 호환정보 Firefox2, Opera9, Safari2, IE6~7 에서 모두 동일하게 position:fixed 형태로 렌더링 합니다. IE5.0~IE5.5 버전의 브라우저에서는 position:absolute 형태로 렌더링 합니다. DTD가 Quirks Mode 상태일 때에는 적용되지 않습니다. 발견된 문제점 현재 코드는 IE6 핵으로서 #aside 영역에 _z-index:-1 속성을 사용하였기 때문에 IE6 에서는 #aside 영역의 텍스트를 자연스럽게 드래그 하거나 링크를 클릭할 수 없습니다. 다른 브라우저에서는 발생하지 않는 현상입니다. 한편 _z-index:-1 을 제거하게 되면 텍스트를 드래그 하거나 링크를 클릭하는 것이 가능하지만 화면크기를 줄였을 때 #aside 레이어가 세로 스크롤바를 덮는 현상이 발생합니다. 이 문제 역시 IE6 에서만 발생하는 현상입니다. 참조 http://www.cssplay.co.uk/layouts/fixed.html http://hiphapis.net/entry/IE6fixed http://naradesign.net/wp/2007/09/08/128/
by Anna 안나 2008. 7. 29. 15:51
사실 ‘따라다닌다’ 는 표현은 잘못된 표현이고 그 반대로 ‘고정된’ 이라고 부르는 것이 맞는 표현 같습니다. 이번 글은 언젠가 한번 정리하려고 생각해 놓은 주제였는데 모질라 커뮤니티에서 어떤분이 ‘따라다니는 배너’ 소스에 대한 질문을 하셨기에 그곳에 답변 달아드리고 이곳에도 포스팅 합니다. Javascript 가 Client Side 의 UI를 풍부하게 해주는 것만은 사실이지만 꼭 필요한 곳에만 사용해야 한다는 원칙이 필요합니다. 사실 저는 Javascript 코드를 처음부터 끝까지 직접 짜는 능력은 없지만 다행히도 특별히 코치해 주시는 선생님 과 주변의 전문가들이 계셔서 매번 어렵지 않게 문제를 해결하고 있습니다. 하지만 이마저도 싫어라 합니다. Javascript 가 동작하지 않는 환경을 고려하여 웹문서의 접근성을 높이려는 이유 입니다. 바로 본론으로 들어갑니다. 아래와 같은 코드를 사용하면 ‘CSS 만으로 따라다니는 배너 만들기(Updated_070908)‘ 가 가능합니다. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Fixed Quick Link</title>
<style type="text/css">
#quickLink { position:fixed; _position:absolute; left:800px; top:200px; width:100px; height:300px; background:#CCC;}
</style>
</head> <body>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<p>-</p>
<div id="quickLink">Fixed Quick Link</div>
</body>
</html> 웹 브라우저(Vendor) 호환성 측면 검토
Firefox, Opera, Safari 브라우저와 특히 IE 7.x 도 이것을 지원합니다. 단, IE6.x 에서는 position:fixed 라는 표준속성을 지원하지 않기 때문에 예제코드에는 underscore hack ‘_’ 을 사용하였고 이것은 IE 6.x 이하의 버전에서만 position:absolute 방식으로 작동하게 된다는 것을 의미합니다. 즉, IE 6.x 이하의 버전에서는 문서의 내용에 고정되고 나머지 브라우저에서는 문서와는 별개로 창에 고정(fixed)되어 의도했던 효과대로 스크롤을 따라다니는 것처럼 보입니다. 장점
자바스크립트를 사용하는 것보다 시스템리소스를 덜 잡아먹으며 코드가 줄고 ‘깔끔’ 해진다는점 입니다. 단점 IE 6.x 브라우저에서만 다르게 렌더링 된다는 점 입니다. 하지만 이것은 큰 문제가 되지는 않는다고 생각합니다. 저같은 경우는 클라이언트를 직접 설득합니다. 그렇지 않아도 AxtiveX 나 다른 필수 Javascript 때문에 로딩속도가 느린데 그런 단순한 기능도 Javascript 를 사용해서 페이지 로딩속도에 지장주지 말고 웹 표준으로 깔끔하게 처리하자구요. 실제로 있었던 일입니다. ‘IE 6.x 에서 큰 문제가 되지 않는다’ 는 발언으로 미루어 추측하셨겠지만 특히 요즈음과 같은 경우 하위버전 호환성보다 상위버전 호환성에 무게를 두고 개발하는 편입니다. 내년 상반기부터는 IE 7.x 에 대한 자동업데이트가 시작될 테니까요. http://naradesign.net/wp/2006/12/16/101/
by Anna 안나 2008. 7. 29. 15:48
"ㄱ" 에 있는 특수문자 [문장부호] 공백 ! ' , . / : ; ? ^ _ ` |  ̄ 、 。 · ‥ … ¨ 〃 ­ ― ∥ \ ∼ ´ ~ ˇ ˘ ˝ ˚ ˙ ¸ ˛ ¡ ¿ ː "ㄴ" 에 있는 특수문자 [괄호] " ( ) [ ] { } ‘ ‘ “ ” 〔 〕 〈 〉 《 》 「 」 『 』 【 】 "ㄷ" 에 있는 특수문자 [수학 기호] + - < = > ± × ÷ ≠ ≤ ≥ ∞ ∴ ♂ ♀ ∠ ⊥ ⌒ ∂ ∇ ≡ ≒ ≪ ≫ √ ∽ ∝ ∵ ∫ ∬ ∈ ∋ ⊆ ⊇ ⊂ ⊃ ∪ ∩ ∧ ∨ ¬ ⇒ ⇔ ∀ ∃ ∮ ∑ ∏ "ㄹ" 에 있는 특수문자 [단위] $ % ₩ F ′ ″ ℃ Å ¢ £ ¥ ¤ ℉ ‰ € ㎕ ㎖ ㎗ ℓ ㎘ ㏄ ㎣ ㎤ ㎥ ㎦ ㎙ ㎚ ㎛ ㎜ ㎝ ㎞ ㎟ ㎠ ㎡ ㎢ ㏊ ㎍ ㎎ ㎏ ㏏ ㎈ ㎉ ㏈ ㎧ ㎨ ㎰ ㎱ ㎲ ㎳ ㎴ ㎵ ㎶ ㎷ ㎸ ㎹ ㎀ ㎁ ㎂ ㎃ ㎄ ㎺ ㎻ ㎼ ㎽ ㎾ ㎿ ㎐ ㎑ ㎒ ㎓ ㎔ Ω ㏀ ㏁ ㎊ ㎋ ㎌ ㏖ ㏅ ㎭ ㎮ ㎯ ㏛ ㎩ ㎪ ㎫ ㎬ ㏝ ㏐ ㏓ ㏃ ㏉ ㏜ ㏆ "ㅁ" 에 있는 특수문자 [아이콘] # & * @ § ※ ☆ ★ ○ ● ◎ ◇ ◆ □ ■ △ ▲ ▽ ▼ → ← ↑ ↓ ↔ 〓 ◁ ◀ ▷ ▶ ♤ ♠ ♡ ♥ ♧ ♣ ⊙ ◈ ▣ ◐ ◑ ▒ ▤ ▥ ▨ ▧ ▦ ▩ ♨ ☏ ☎ ☜ ☞ ¶ † ‡ ↕ ↗ ↙ ↖ ↘ ♭ ♩ ♪ ♬ ㉿ ㈜ № ㏇ ™ ㏂ ㏘ ℡ ® ª º "ㅂ" 에 있는 특수문자 [선] ─ │ ┌ ┐ ┘ └ ├ ┬ ┤ ┴ ┼ ━ ┃ ┏ ┓ ┛ ┗ ┣ ┳ ┫ ┻ ╋ ┠ ┯ ┨ ┷ ┿ ┝ ┰ ┥ ┸ ╂ ┒ ┑ ┚ ┙ ┖ ┕ ┎ ┍ ┞ ┟ ┡ ┢ ┦ ┧ ┩ ┪ ┭ ┮ ┱ ┲ ┵ ┶ ┹ ┺ ┽ ┾ ╀ ╁ ╃ ╄ ╅ ╆ ╇ ╈ ╉ ╊ "ㅅ" 에 있는 특수문자 [한글] ㉠ ㉡ ㉢ ㉣ ㉤ ㉥ ㉦ ㉧ ㉨ ㉩ ㉪ ㉫ ㉬ ㉭ ㉮ ㉯ ㉰ ㉱ ㉲ ㉳ ㉴ ㉵ ㉶ ㉷ ㉸ ㉹ ㉺ ㉻ ㈀ ㈁ ㈂ ㈃ ㈄ ㈅ ㈆ ㈇ ㈈ ㈉ ㈊ ㈋ ㈌ ㈍ ㈎ ㈏ ㈐ ㈑ ㈒ ㈓ ㈔ ㈕ ㈖ ㈗ ㈘ ㈙ ㈚ ㈛ "ㅇ" 에 있는 특수문자 [알파벳과 숫자] ⓐ ⓑ ⓒ ⓓ ⓔ ⓕ ⓖ ⓗ ⓘ ⓙ ⓚ ⓛ ⓜ ⓝ ⓞ ⓟ ⓠ ⓡ ⓢ ⓣ ⓤ ⓥ ⓦ ⓧ ⓨ ⓩ ① ② ③ ④ ⑤ ⑥ ⑦ ⑧ ⑨ ⑩ ⑪ ⑫ ⑬ ⑭ ⑮ ⒜ ⒝ ⒞ ⒟ ⒠ ⒡ ⒢ ⒣ ⒤ ⒥ ⒦ ⒧ ⒨ ⒩ ⒪ ⒫ ⒬ ⒭ ⒮ ⒯ ⒰ ⒱ ⒲ ⒳ ⒴ ⒵ ⑴ ⑵ ⑶ ⑷ ⑸ ⑹ ⑺ ⑻ ⑼ ⑽ ⑾ ⑿ ⒀ ⒁ ⒂ "ㅈ" 에 있는 특수문자 [숫자] 0 1 2 3 4 5 6 7 8 9 ⅰ ⅱ ⅲ ⅳ ⅴ ⅵ ⅶ ⅷ ⅸ ⅹ Ⅰ Ⅱ Ⅲ Ⅳ Ⅴ Ⅵ Ⅶ Ⅷ Ⅸ Ⅹ "ㅊ" 에 있는 특수문자 [분수와 제곱] ½ ⅓ ⅔ ¼ ¾ ⅛ ⅜ ⅝ ⅞ ¹ ² ³ ⁴ ⁿ ₁ ₂ ₃ ₄ "ㅋ" 에 있는 특수문자 [한글] ㄱ ㄲ ㄳ ㄴ ㄵ ㄶ ㄷ ㄸ ㄹ ㄺ ㄻ ㄼ ㄽ ㄾ ㄿ ㅀ ㅁ ㅂ ㅃ ㅄ ㅅ ㅆ ㅇ ㅈ ㅉ ㅊ ㅋ ㅌ ㅍ ㅎ ㅏ ㅐ ㅑ ㅒ ㅓ ㅔ ㅕ ㅖ ㅗ ㅘ ㅙ ㅚ ㅛ ㅜ ㅝ ㅞ ㅟ ㅠ ㅡ ㅢ ㅣ "ㅌ" 에 있는 특수문자 [한글] ㅥ ㅦ ㅧ ㅨ ㅩ ㅪ ㅫ ㅬ ㅭ ㅮ ㅯ ㅰ ㅱ ㅲ ㅳ ㅴ ㅵ ㅶ ㅷ ㅸ ㅹ ㅺ ㅻ ㅼ ㅽ ㅾ ㅿ ㆀ ㆁ ㆂ ㆃ ㆄ ㆅ ㆆ ㆇ ㆈ ㆉ ㆊ ㆋ ㆌ ㆍ ㆎ "ㅍ" 에 있는 특수문자 [영문 대소문자] A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z "ㅎ" 에 있는 특수문자 Α Β Γ Δ Ε Ζ Η Θ Ι Κ Λ Μ Ν Ξ Ο Π Ρ Σ Τ Υ Φ Χ Ψ Ω α β γ δ ε ζ η θ ι κ λ μ ν ξ ο π ρ σ τ υ φ χ ψ ω HTML Spacial Entities ¡ &iexcl; ¢ &cent; £ &pound; ¥ &yen; § &sect; ¨ &uml; ⓒ &copy; ≪ &laquo; ¬ &not; ® &reg; ° &deg; ± &plusmn; ´ &acute; μ &micro; ¶ &para; · &middot; ¸ &cedil; ≫ &raquo; ¿ &iquest; A &Agrave; A &Aacute; A &Acirc; A &Atilde; A &Auml; A &Aring; Æ &AElig; C &Ccedil; E &Egrave; E &Eacute; E &Ecirc; E &Euml; I &Igrave; I &Iacute; I &Icirc; I &Iuml; N &Ntilde; O &Ograve; O &Oacute; O &Otilde; O &Ouml; Ø &Oslash; U &Ugrave; U &Uacute; U &Ucirc; U &Uuml; ß &szlig; a &agrave; a &aacute; a &acirc; a &atilde; a &auml; a &aring; æ &aelig; c &ccedil; e &egrave; e &eacute; e &ecirc; e &euml; i &igrave; i &iacute; i &icirc; i &iuml; n &ntilde; o &ograve; o &oacute; o &ocirc; o &otilde; o &ouml; ÷ &divide; ø &oslash; u &ugrave; u &uacute; u &ucirc; u &uuml; y &yuml; ? &#8218; ? &#402; ? &#8222; … &#8230; † &#8224; ‡ &#8225; ? &#710; ‰ &#8240; ? &#8249; Œ &#338; ‘ &#8216; ’ &#8217; “ &#8220; ” &#8221; ? &#8226; ? &#8211; ? &#8212; ? &#732; ™ &#8482; ? &#8250; œ &#339; ? &#376; &nbsp; 특수문자 입력방법 한글 자음 한글자를 입력하고 한자키를 누릅니다.
예) ㅁ+ 한자키
← 직접 해보기 그 밖의 특수문자 가타가나(ァィゥェ…) = ㅃ + 한자키
히라가나(ぁぃぅぇ…) = ㄸ + 한자키 http://naradesign.net/wp/2006/10/30/86/
by Anna 안나 2008. 7. 29. 15:46
http://dean.edwards.name/IE7/ 에 가시면 IE7, 8 라이브러리의 오픈소스 프로젝트 진행현황도 보실 수 있으며 현재까지 개발된 IE7, IE8 라이브러리도 배포하고 있습니다. 현재로써 최신 버전은 2.0이며 지금 가보니 Beta 1, 2, 3으로 나뉘어 있네요. 아무거나 쓰셔도 상관없습니다. http://forum.standardmag.org/viewtopic.php?id=1987
by Anna 안나 2008. 7. 29. 15:45
※이미지를 클릭하시면 더욱 편리하게 보실 수 있습니다.
첨부파일에 본 게시물의 모든 이미지들의 압축파일(zip)을 첨부하였습니다. 맨 아래에서 다운로드받으실 수 있습니다.

((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))

prettyimages2.zip

'디자인소스 > i_retouching' 카테고리의 다른 글

이쁜 이미지  (0) 2008.07.27
보정2  (0) 2008.07.27
보정1  (0) 2008.07.27
by Anna 안나 2008. 7. 27. 15:24
※이미지를 클릭하시면 더욱 편리하게 보실 수 있습니다.
첨부파일에 본 게시물의 모든 이미지들의 압축파일(zip)을 첨부하였습니다. 맨 아래에서 다운로드받으실 수 있습니다.

((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))

prettyimages1.zip

'디자인소스 > i_retouching' 카테고리의 다른 글

이쁜 이미지2  (0) 2008.07.27
보정2  (0) 2008.07.27
보정1  (0) 2008.07.27
by Anna 안나 2008. 7. 27. 15:16
※이미지를 클릭하시면 더욱 편리하게 보실 수 있습니다.
첨부파일에 보정2의 압축파일(zip)을 첨부하였습니다. 맨 아래에서 다운로드받으실 수 있습니다.

((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))

보정2.zip

'디자인소스 > i_retouching' 카테고리의 다른 글

이쁜 이미지2  (0) 2008.07.27
이쁜 이미지  (0) 2008.07.27
보정1  (0) 2008.07.27
by Anna 안나 2008. 7. 27. 15:06
※이미지를 클릭하시면 더욱 편리하게 보실 수 있습니다.
첨부파일에 보정1의 압축파일(zip)을 첨부하였습니다. 맨 아래에서 다운로드받으실 수 있습니다.

((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))
((-------IMAGE-------))

보정1.zip

'디자인소스 > i_retouching' 카테고리의 다른 글

이쁜 이미지2  (0) 2008.07.27
이쁜 이미지  (0) 2008.07.27
보정2  (0) 2008.07.27
by Anna 안나 2008. 7. 27. 15:00
이미지용량도 크고 이미지갯수도 많은 관계로....
본문에 삽입하진 않겠습니다.


사용하실 분들은 첨부파일에서 다운로드받으시기 바랍니다.

'디자인소스 > i_bg' 카테고리의 다른 글

저작권 없는 무료 이미지 사이트 100선  (0) 2009.01.05
푸른 숲같은 길  (0) 2008.07.27
부드러운 배경 2개  (0) 2008.03.28
반짝이는 심플한배경들  (0) 2008.03.02
회색배경  (0) 2008.03.02
분홍파스텔느낌  (0) 2008.03.02
by Anna 안나 2008. 7. 27. 14:50
((-------IMAGE-------))

'디자인소스 > i_bg' 카테고리의 다른 글

저작권 없는 무료 이미지 사이트 100선  (0) 2009.01.05
포토샵합성용 텍스쳐  (0) 2008.07.27
부드러운 배경 2개  (0) 2008.03.28
반짝이는 심플한배경들  (0) 2008.03.02
회색배경  (0) 2008.03.02
분홍파스텔느낌  (0) 2008.03.02
by Anna 안나 2008. 7. 27. 14:43
이쁜 리본이미지입니다.
잘라서 사용하세요~^_^

((-------IMAGE-------))

((-------IMAGE-------))

'디자인소스 > i_icon' 카테고리의 다른 글

유용한 무료아이콘 배포소들.^^몇가지.  (0) 2008.11.27
블로그 피드 RSS 아이콘 모두  (0) 2008.07.20
귀여운 이모티콘  (0) 2008.03.28
블루세트(blue set) 아이콘들  (0) 2008.03.28
투톤 아이콘 - blue  (0) 2008.03.28
투톤 아이콘 - green  (0) 2008.03.28
투톤 아이콘 - gray  (0) 2008.03.28
미니 실버 아이콘  (0) 2008.03.28
귀여운아이콘^^  (0) 2008.03.02
깔끔한아이콘 조금!  (0) 2008.03.02
by Anna 안나 2008. 7. 27. 14:42
((-------IMAGE-------)) RSS 아이콘 모음
블로그 피드 RSS 아이콘 모두 모여라


블로그에 필수적으로 존재하는 아이콘, 바로 피드(RSS)아이콘입니다. 블로그세계를 돌아다니다보면 아주 큰 RSS아이콘과 움직이는 RSS아이콘등 다양한 형태의 RSS아이콘들이 있습니다. 이렇게 톡톡튀는 RSS아이콘은 분명 구독자수를 늘리거나 블로그를 좀더 보기좋게 하는데에도 영향이 있을것입니다. 무료로 제공되고 있는 RSS아이콘 정보를 모았습니다. 아래 정보를 보시고 자신의 블로그에 어울릴만한 RSS아이콘이 있다면 새로운 RSS아이콘을 설치해보시기 바랍니다. -블로그 피드 RSS 아이콘 모두 모여라! * 피드 RSS 아이콘 모음
((-------IMAGE-------))
FeedIcons ▷ http://www.feedicons.com/


((-------IMAGE-------))
zeusboxstudio ▷ http://www.zeusboxstudio.com/blog/feedicons-2


((-------IMAGE-------))
Grunge Style Rss Feed Icons ▷ http://customize.org/icons/55872


((-------IMAGE-------))
Free RSS Feed Icons ▷ http://www.nyssajbrown.net/


((-------IMAGE-------)) Collection of Feed Icons ▷ http://perishablepress.com/

((-------IMAGE-------)) 30개 무료 RSS아이콘 ▷ http://www.snap2objects.com/

((-------IMAGE-------))
스타일리쉬 RSS아이콘 ▷ http://www.vecteezy.com/vf/236-New-RSS-Icon

((-------IMAGE-------))
RSS 아이콘 10개 ▷ http://www.aucklandseo.com/2007/10/26/rss_icons/

((-------IMAGE-------))
Matt Forsythe RSS 아이콘 ▷ http://comingupforair.net/2008/01/18/rss-icons/

((-------IMAGE-------))
RSS READER Icon ▷ http://twinware.deviantart.com/

((-------IMAGE-------)) ((-------IMAGE-------)) ((-------IMAGE-------))
애니메이션 RSS Icon ▷ http://abdussamad.com

((-------IMAGE-------))
Fasticon ▷ http://fasticon.com/freeware/?p=40

((-------IMAGE-------)) 유리스타일 피드 아이콘 ▷ http://www.bittbox.com/

((-------IMAGE-------)) 크리스마스 RSS아이콘 ▷ http://www.ajaxpath.com/christmas-rss-icons

((-------IMAGE-------))
Rss Dock Icon ▷ http://alperesin.deviantart.com

((-------IMAGE-------))
기타 피크 모양 아이콘 ▷ http://lorinator.feminoise.com/

((-------IMAGE-------))
블로그를 위한 51개의 RSS아이콘 ▷ gloryinlife.com

http://blogplay.net/entry/블로그-피드-RSS-아이콘-모두-모여라

'디자인소스 > i_icon' 카테고리의 다른 글

유용한 무료아이콘 배포소들.^^몇가지.  (0) 2008.11.27
리본이미지  (0) 2008.07.27
귀여운 이모티콘  (0) 2008.03.28
블루세트(blue set) 아이콘들  (0) 2008.03.28
투톤 아이콘 - blue  (0) 2008.03.28
투톤 아이콘 - green  (0) 2008.03.28
투톤 아이콘 - gray  (0) 2008.03.28
미니 실버 아이콘  (0) 2008.03.28
귀여운아이콘^^  (0) 2008.03.02
깔끔한아이콘 조금!  (0) 2008.03.02
by Anna 안나 2008. 7. 20. 18:03
다음은 CSS로 구현된 Layout을 소개하는 사이트들입니다.
제가든같이 유명한 곳은 많이들 알고 계실테고,
제가 즐겨찾는 몇몇 곳은 다양한 형태의 레이아웃을 보여주기도 해서 공부가 많이 되고 있습니다.
http://www.cssjuice.com/30-weblogs-with-grid-based-design/http://www.cssimport.com/http://www.mezzoblue.com/zengarden/alldesigns/http://www.alistapart.com/articles/holygrail

아래 사이트의 경우에는 순수하게 레이아웃만을 보여주고 있어, CSS로 처음 레이아웃을 잡아야 하는 경우에 도움이 많이 됩니다. 저도 처음에 이 곳에서 소스를 가져와서 수정해서 사용했던적이 있었습니다.

http://blog.html.it/layoutgala/

'개인 > freeboard' 카테고리의 다른 글

'The Simpsons' 에피소드별 제목  (0) 2008.11.25
cyworld layout  (0) 2008.11.23
반응속도 테스트  (0) 2008.09.21
가치평가에 이어..상대방평가?를 해보았다.^^  (0) 2008.09.21
가치평가  (0) 2008.09.21
jQuery 관련 링크  (0) 2008.07.12
구글 매니아가 구글에 환호하는 이유  (0) 2008.07.07
구글 스타일 로고 만들기  (0) 2008.07.07
재미있는 페이지.  (0) 2008.07.07
산돌폰트패키지 뷰어(viewer)  (0) 2008.06.29
by Anna 안나 2008. 7. 12. 23:57
요즘 jquery를 하나하나 사용해보는 재미가 쏠쏠하네요.

jquery와 관련된 링크 기록용 포스트 입니다. :)

jQuery 공식 사이트 http://jquery.com/

Ajaxrain - jQuery 외에 기타 자바스크립트 프레임웍의 플러그인 등의 많은 자료가 있습니다. http://ajaxrain.com/

jQuery 개발자를 위한 메모 - 기본·샘플http://cafe.naver.com/rubython/419jQuery 개발자를 위한 메모 - 플러그인http://cafe.naver.com/rubython/421내가 Prototype에서 jQuery로 옮긴 이유http://dogfeet.tistory.com/29jQuery로 Ajax 개발을 단순화 하기http://ajax-widget.blogspot.com/2007/09/jquery-ajax.htmljQuery vs Prototypehttp://dancer.tistory.com/82http://www.chazzuka.com/blog/index.php?p=47&t=jquery-vs-prototype-javascript-framework.html플러그인 데모 모음http://gnusr.com/g4/bbs/board.php?bo_table=ajax&wr_id=15http://www.gnusr.com/Ajax/javascripts/demo/

'개인 > freeboard' 카테고리의 다른 글

cyworld layout  (0) 2008.11.23
반응속도 테스트  (0) 2008.09.21
가치평가에 이어..상대방평가?를 해보았다.^^  (0) 2008.09.21
가치평가  (0) 2008.09.21
CSS로 만든 Layout 소개  (1) 2008.07.12
구글 매니아가 구글에 환호하는 이유  (0) 2008.07.07
구글 스타일 로고 만들기  (0) 2008.07.07
재미있는 페이지.  (0) 2008.07.07
산돌폰트패키지 뷰어(viewer)  (0) 2008.06.29
온라인 촛불 문화제 이미지들..  (0) 2008.06.21
by Anna 안나 2008. 7. 12. 23:57
1024×768 : (1004 × 617) / 800×600 : (780×449)
윈도우의 테두리 + 세로스크롤바의 크기는 총 28px
세로의 영역은 개인의 윈도우에 따라 가변이 크나 일반적으로(주소창,도구창)있는 경우에만 해당함
by Anna 안나 2008. 7. 12. 22:26
이 문서는 다음 두 곳을 상당부분 참고하여 작성되었습니다. TracOnWindows : http://yeoupooh.us.to:8080/wiki/display/pu/TracOnWindowstrac 한글번역 프로젝트 : http://kldp.net/forum/?group_id=724 trac 설치 TracOnWindows 패키지를 받아 http://yeoupooh.us.to:8080/wiki/display/pu/TracOnWindows 설명대로 설치trac 한글번역 프로젝트 0.10.4-ko (http://kldp.net/forum/forum.php?forum_id=3781) 설치 패키지파일을 받아 를 압축을 임시 폴더에 푼다.TracOnWindow 의 setenv.bat (C:\Trac\ 에 위치) 가 실행된 상태,압축이 풀어져있는 폴더의 루트에서 python ./setup.py install 수행 trac 플러그인 설치 기초작업 수행 C:\Trac\Python\Scripts 의 easy_install-2.4-script.py, easy_install-script.py 의 첫줄 경로를 수정해줄것(C:\Trac\Python\Python.exe 로)개별 플러그인 설치는 http://trac.edgewall.org/wiki/TracPlugins 을 참조할것 TracWebAdmin 플러그인 설치 TracWebAdmin-0.1.2dev_r4240-py2.4.egg 를 C:\Tra\Python\Scripts 폴더에 복사C:\Trac\Python\Scripts 에서 easy_install TracWebAdmin-0.1.2dev_r4240-py2.4.egg 를 수행C:\Trac\TracRepo\Projects\프로젝트명\conf 에서 trac.ini 의 마지막에 [components] / webadmin.* = enabled 의 두 줄을 추가 (http://trac.edgewall.org/wiki/WebAdmin#EnablingthePlugin 참고) AccountManager 플러그인 설치 TracAccountManager-0.1.3dev-py2.4.egg 를 C:\Trac\Python\Scripts 폴더에 복사C:\Trac\Python\Scripts 에서 easy_install TracAccountManager-0.1.3dev-py2.4.egg 를 수행 어드민계정을 설정 C:\Trac\SvnRepo\Projects 의 trac.passwd 파일 내용 제거C:\Trac 에서 'add-user admin 암호' 를 수행하여 새로운 암호의 admin 을 설정'trac-admin 프로젝트명 permission add admin TRAC_ADMIN' 을 주어 트랙 어드민 권한을 admin 에게 설정(http://trac.edgewall.org/wiki/TracPermissions) run-apache 로 아파치 기동하고, http://ip:8080/projects/프로젝트명 에 접속하여 admin 으로 로그인후 Admin 탭에서 플러그인 세팅 마저함. AccountManager 켜고 서버 재기동Admin 탭의 Accounts 항목 하부 Configuration 에서 패스워드 저장방법을 HtPasswdStore 로 설정하고 패스워드 파일의 경로를 풀패스(C:\Trac\SvnRepo\Projects\trac.htpasswd)로 지정해줄것 http://trac.edgewall.org/wiki/TracPermissions#PermissionGroups 를 참조해 그룹별 퍼미션 세팅WebAdmin 으로 기타 세부사항 수정(프로젝트 상단 배너나 링크주소 등등..)
by Anna 안나 2008. 7. 12. 22:17
{1}활성화된 모든 티켓들Active Tickets

* 활성화된 전체 티켓들을 볼 수 있습니다.
* 급한 티켓은 각 색을 기본으로 정렬됩니다.
* 티켓이 통과되어지면, 담당자의 이름 뒤에 '*' 가 붙습니다.

* List all active tickets by priority.
* Color each row based on priority.
* If a ticket has been accepted, a '*' is appended after the owner's name
SELECT p.value AS __color__,
id AS ticket, summary, component, version, milestone, t.type AS type,
(CASE status WHEN 'assigned' THEN owner||' *' ELSE owner END) AS owner,
time AS created,
changetime AS _changetime, description AS _description,
reporter AS _reporter
FROM ticket t
LEFT JOIN enum p ON p.name = t.priority AND p.type = 'priority'
WHERE status IN ('new', 'assigned', 'reopened')
ORDER BY p.value, milestone, t.type, time


{2}Active Tickets by Version
This report shows how to color results by priority,
while grouping results by version.

Last modification time, description and reporter are included as hidden fields
for useful RSS export.
SELECT p.value AS __color__,
version AS __group__,
id AS ticket, summary, component, version, t.type AS type,
(CASE status WHEN 'assigned' THEN owner||' *' ELSE owner END) AS owner,
time AS created,
changetime AS _changetime, description AS _description,
reporter AS _reporter
FROM ticket t
LEFT JOIN enum p ON p.name = t.priority AND p.type = 'priority'
WHERE status IN ('new', 'assigned', 'reopened')
ORDER BY (version IS NULL),version, p.value, t.type, time



{3}마일스톤 별 활성화된 모든 티켓들Active Tickets by Milestone
마일스톤 별 활성화된 모든 티켓들을 보여줍니다.

This report shows how to color results by priority,
while grouping results by milestone.

Last modification time, description and reporter are included as hidden fields
for useful RSS export.
SELECT p.value AS __color__,
milestone||' Release' AS __group__,
id AS ticket, summary, component, version, t.type AS type,
(CASE status WHEN 'assigned' THEN owner||' *' ELSE owner END) AS owner,
time AS created,
changetime AS _changetime, description AS _description,
reporter AS _reporter
FROM ticket t
LEFT JOIN enum p ON p.name = t.priority AND p.type = 'priority'
WHERE status IN ('new', 'assigned', 'reopened')
ORDER BY (milestone IS NULL),milestone, p.value, t.type, time



{4}담당자별 활성화된 티켓들Assigned, Active Tickets by Owner

담당자별로 활성화된 티켓들을 보여줍니다.

List assigned tickets, group by ticket owner, sorted by priority.
SELECT p.value AS __color__,
owner AS __group__,
id AS ticket, summary, component, milestone, t.type AS type, time AS created,
changetime AS _changetime, description AS _description,
reporter AS _reporter
FROM ticket t
LEFT JOIN enum p ON p.name = t.priority AND p.type = 'priority'
WHERE status = 'assigned'
ORDER BY owner, p.value, t.type, time

{5}
담당자별 활성화된 티켓들 자세히
Assigned, Active Tickets by Owner (Full Description)

담당자별로 활성화된 티켓들을 보여줍니다.

List tickets assigned, group by ticket owner.
This report demonstrates the use of full-row display.

SELECT p.value AS __color__,
owner AS __group__,
id AS ticket, summary, component, milestone, t.type AS type, time AS created,
description AS _description_,
changetime AS _changetime, reporter AS _reporter
FROM ticket t
LEFT JOIN enum p ON p.name = t.priority AND p.type = 'priority'
WHERE status = 'assigned'
ORDER BY owner, p.value, t.type, time



{6}
마일스톤별 모든 티켓들
All Tickets By Milestone (Including closed)

마일스톤별로 해결된 티켓들까지 모두 보여줍니다.

A more complex example to show how to make advanced reports.

SELECT p.value AS __color__,
t.milestone AS __group__,
(CASE status
WHEN 'closed' THEN 'color: #777; background: #ddd; border-color: #ccc;'
ELSE
(CASE owner WHEN $USER THEN 'font-weight: bold' END)
END) AS __style__,
id AS ticket, summary, component, status,
resolution,version, t.type AS type, priority, owner,
changetime AS modified,
time AS _time,reporter AS _reporter
FROM ticket t
LEFT JOIN enum p ON p.name = t.priority AND p.type = 'priority'
ORDER BY (milestone IS NULL), milestone DESC, (status = 'closed'),
(CASE status WHEN 'closed' THEN modified ELSE (-1)*p.value END) DESC


{7}
나에게 할당된 티켓들


이 리포트는 실행될 때 로그온한 사용자이름으로 자동으로 변경되는, $USER 동적 변수의 사용 방법을 보여줍니다.

This report demonstrates the use of the automatically set
USER dynamic variable, replaced with the username of the
logged in user when executed.


SELECT p.value AS __color__,
(CASE status WHEN 'assigned' THEN 'Assigned' ELSE 'Owned' END) AS __group__,
id AS ticket, summary, component, version, milestone,
t.type AS type, priority, time AS created,
changetime AS _changetime, description AS _description,
reporter AS _reporter
FROM ticket t
LEFT JOIN enum p ON p.name = t.priority AND p.type = 'priority'
WHERE t.status IN ('new', 'assigned', 'reopened') AND owner = $USER
ORDER BY (status = 'assigned') DESC, p.value, milestone, t.type, time


{8}활성화된 티켓, 나에게 할당된 티켓들을 먼저 보여줍니다 Active Tickets, Mine first

* 우선순위별로 활성화된 모든 티켓들을 보여줍니다.
* 로그인한 사용자가 소유한 티켓들을 먼저 보여줍니다.

* List all active tickets by priority.
* Show all tickets owned by the logged in user in a group first.

SELECT p.value AS __color__,
(CASE owner
WHEN $USER THEN 'My Tickets'
ELSE 'Active Tickets'
END) AS __group__,
id AS ticket, summary, component, version, milestone, t.type AS type,
(CASE status WHEN 'assigned' THEN owner||' *' ELSE owner END) AS owner,
time AS created,
changetime AS _changetime, description AS _description,
reporter AS _reporter
FROM ticket t
LEFT JOIN enum p ON p.name = t.priority AND p.type = 'priority'
WHERE status IN ('new', 'assigned', 'reopened')
ORDER BY (owner = $USER) DESC, p.value, milestone, t.type, time


-
by Anna 안나 2008. 7. 12. 18:42

by Anna 안나 2008. 7. 12. 17:46

by Anna 안나 2008. 7. 12. 17:45
^^ㅅㄷㄴㅅ
by Anna 안나 2008. 7. 12. 17:40
voice-family: ""}""; 위는 시각장애인용 웹브라우저에서 글자를 판독할 때 사용되는 목소리를 지정하는 속성입니다. font-family와 같이 이해하면 쉬워요. ' '사이에 사용할 수 있는 값은 'male', 'female', 'child' 으로써 남자,여자,어린이 목소리로 글을 판독하게 됩니다. 사실 저도 아직 사용해본 적이 없을 뿐더러, 시각장애인 전용 브라우저가 아닌 IE나 FF에서는 제대로 지원하지 않습니다.

voice-family:inherit; 이건 상속된다는 뜻이죠~ http://forum.standardmag.org/viewtopic.php?id=19
by Anna 안나 2008. 7. 12. 16:40
html>body #content {} 이건 인터넷익스플러 핵(hack)입니다. 전체 코드를 확인할 수 없지만, 보통 인터넷익스플러가 CSS를 제대로 랜더링 하지 못하는 박스모델링에서 사용합니다. 인터넷익스플러는 width, height 를 표준이 아닌 MS맘대로 해석하기 때문에 익스플러만 해석하는 html 을 사용한 것입니다. 그건 Tantek Hack이라고 불리우는 CSS Boxmodel Hack입니다.

css boxmodel에선 width란 padding이나 border를 제외한 순수 컨텐츠가 들어가는 박스의 폭을 얘기하지만 IE5.x에선 이 width나 height안에 padding과 border를 포함시켜버립니다.

{ width:100px; padding:10px; border: 10px; }
이런 박스가 있다고 할때 표준 브라우저에서 box의 총 width는 140px이 되지만 IE5.x에선 100px이죠.
그래서 hack이 필요한데 이경우에는 IE5.x의 또다른 버그인 parsing bug를 이용합니다.
키포인트는 ""}"" 입니다.

div.content {
width:400px; /* IE5.x용 */
voice-family: ""}"";

/*IE5.x는 다음룰 무시*/

voice-family:inherit;
width:300px; /*일반 브라우저용*/
}

여기에서 opera5같은 경우는 IE5.x와 동일한 parsing bug가 있지만 boxmodel은 표준을 지원하기때문에 별도로 스타일을 지정해줍니다. ( >주위에 스페이스가 없어야 합니다)

html>body .content {
width:300px; /* Opera 5용 */
}

이 Tantek hack을 사용하려면 반드시 nn4에서는 css가 보이지 않게 해줘야 합니다.

nn4와 opera5같은 브라우저의 문제때문에 이 핵보다는 Simplified Box model Hack이나 Tan hack을 많이 사용하는 편입니다.
by Anna 안나 2008. 7. 12. 16:40
브라우저마다 HTML렌더링하는 방식이 조금씩 차이가 나고, 때로는 버그가 존재하는 관계로(망할 IE) 모든 CSS 코드가 모든 웹브라우저에서 똑같이 보이지 않습니다.
따라서 이러한 특성을 이용하여 특정 브라우저를 제외하거나, 특정 브라우저에서만 CSS를 적용하는 기법을 CSS 핵(Hack) 이라고 부르죠...

그래서 문법적으로 맞지 않거나, 특정 브라우저에만 적용되는 비표준인 경우가 많기 때문에 이러한 CSS핵은 어쩔 수 없는 경우가 아니면 사용하지 않아야 합니다. 또한, 단순히 눈앞의 문제만을 해결하기 위해 핵을 사용하면 나중에 페이지를 수정하거나 브라우저의 버전이 올라갈 때에 문제가 생기는 경우도 있구요.

CSS핵은 이런게 있다는 것도 알아두고, CSS핵을 사용하기 이전에 근본적으로 디자인을 수정하거나 다른 표준 태그로 해결하는게 좋을 듯 하네요.

어쨌든 일단 현존 CSS핵에 대한 정리!

http://centricle.com/ref/css/filters/


서핑하다 찾은 사이트인데 CENTRICLE.COM 의 CSS filters 페이지가 가장 잘 되어 있는 것 같습니다.
이제까지 알려진 CSS핵의 종류와 현존하는 거의 모든 웹 브라우저에서 적용되는지의 여부를 알기쉽게 표로 보여줍니다. 각 항목을 눌러보면 해당 핵의 예제도 볼 수 있네요.

http://www.communis.co.uk/dithered/css_filters/


웹표준 교과서에서 소개하는 CSS 핵 & 필터 안내 페이지

그 외에 평소에 자주 사용하는 팁으로서의 CSS 핵 정리는 아래에 정리.
Netscape 4 배제하기
<link rel="stylesheet" type="text/css" href="/css/style.css" media="all" />
Netscape 는 media 속성이 screen 이 아닌 경우 외부 스타일시트를 읽지 못하는 버그가 존재함.

Win IE 3~4, Mac IE 4~4.5, Netscape 4 배제하기
@import url("/css/style.css")
Win IE 4, Mac IE 4 는 인용부호가 "가 아니면 읽지 못하는 버그 존재. IE 3과 Netscape 4는 @import 지원하지 않음.

Mac IE 5 배제하기
H1 { /* \*/ color:red; /* */ }
Holly 핵이라 하며, 주석 안의 내용이 적용되지 않음.

Win IE 4~5 배제하기
H1/**/ { color:red; }
셀렉터 뒤에 /**/ 삽입.

Win IE 4~5, Mac IE 4.5~5 배제하기
H1 { color/* */:red; }
속성과 속성값을 구분하는 콜론(:) 앞에 /* */ 삽입.

Win IE 4~6, Mac IE 4, Netscape 4 배제하기
html>body H1 { color:red; }
셀렉터 앞에 html>body 삽입.

Win IE 6 제외시키기
H1 { color /**/:red; }
속성과 속성값을 구분하는 콜론(:) 앞에 스페이스와 /**/ 삽입.

언더스코어 핵 (_)
H1 { _color:red; }
Win IE 4~6 에 적용.

닷핵 (.)
H1 { .color:red; }
속성 앞에 . 삽입. Win IE 6~7 에만 적용. 타 브라우저는 정확히 확인하지 못했습니다.
이 핵에 대해선 계속 확인중인데 블로그스피어나 여타 서적에는 전혀 언급이 없는 이상한 핵(?)입니다.

해시 핵(#)
H1 { #color:red; }
속성 앞에 # 삽입. Win IE 4~6, Mac IE 5, Opera 7, Mozilla계열, Firefox 에 적용.

스타 핵
*HTML H1 { color:red; }
셀렉터 앞에 *html 삽입. Win IE 4~6, Mac IE 4~5 에 적용.

스타7 핵
HTML*H1 { color:red; }
셀렉터 앞에 html* 삽입(공백없이). Win IE 5.5~6, Mac IE 5, Safari 에 적용.

xmlns 속성 핵
HTML[xmlns] H1 { color:red; }
셀렉터 앞에 속성 선택자를 삽입. Mozilla, Firefox, Opera, Safari 등 속성 선택자를 지원하는 브라우저에 적용.

:root 가상클래스 핵
:root H1 { color:red; }
셀렉터 앞에 :root 가상클래스 삽입. Mozilla, Firefox, Mac IE 5, Safari 등 가상클래스를 지원하는 브라우저에 적용.

Tantek 박스모델 핵
H1 {
width:500px;
voice-family: ""}"";
voice-family:inherit;
width:400px;
}Tantek Celik 이 고안한 유명한 박스모델 핵. Win IE 4~5, Mac IE 4, Netscape 4 에서는 voice-family 속성 이전의 스타일 적용. 그외의 브라우저는 뒤의 속성 적용.

단순 박스모델 핵
H1 {
width:500px;
w\idth:400px; //Win IE 6, Mac IE 5, Mozilla, Opera, Safari
\width:450px; // only Win IE 5
}
속성의 첫번째, 두번째 글자 사이에 \를 삽입하면 Win IE 6, Mac IE 5, Mozilla, Opera, Safari 에 적용.
추가로 속성의 앞에 \를 삽입하면 Win IE 5 에만 적용.

IE 7, Opera 적용하기
*+html body H1 { color:red; }
셀렉터 앞에 *+html body 삽입. IE 7, Opera 8 이후 버전 적용. Opera를 배제한 IE7 전용으로 하고 싶을 때는 *+html>/**/body 로 Opera 전용 속성 기술.

IE 7 적용하기
*:first-child+html H1 { color:red; }
셀렉터 앞에 *:first-child+html 삽입. IE 7에만 적용되고, 이외의 브라우저는 앞에서 기술한 셀렉터의 속성 적용.

Win IE 5 패스필터
@media tty {
i{content:"";/*" "*/}}; @import '/css/style.css'; {;}/*";}
}/* */

Win IE 5.5 패스필터
@media tty {
i{content:"";/*" "*/}}@m; @import '/css/style.css';/*";}
}/* */

Win IE 6 패스필터(?)
<!--[if IE 6]><link rel="stylesheet" type="text/css" href="/css/style.css" media="all" /><![endif]-->

Win IE 7 패스필터(?)
<!--[if gte IE 7]><link rel="stylesheet" type="text/css" href="/css/style.css" media="all" /><![endif]-->

모던브라우저 패스필터 (Win IE 5.5 이하, Mac IE 5, Opera 8 이하, Netscape 4 이하 제외)
@import "null?"{";
@import "/css/style.css";
@import "null?"}";


저의 주 작업 브라우저는 IE6, IE7, FF2, OP9 입니다. 개인적으로 CSS 핵은 거의 사용하지 않지만, 폼 (특히 체크박스, 라디오 버튼) 의 형태가 각 브라우저마다 틀려서 IE 6~7 에서 폼의 마진을 조절하기 위해 언더스코어 핵, 닷핵 만을 사용하고 있습니다.
덧붙여... 우리나라에서 최고의 사용률을 보여주는 IE가 CSS Spec을 제대로 지원하지 않으면서도 이를 업데이트하지 않는 이유는, 아이러니컬하게도 브라우저간 버그를 보정하기 위한 CSS핵도 큰 이유를 차지하고 있는 듯.
IE 6에서 갑자기 IE 7 또는 표준스펙 풀 지원으로 CSS 지원 스펙을 수정하면 현재 IE 6 기준으로 만들어진 사이트나 IE 6용 패스필터, 핵을 사용한 엄청난 수의 사이트(특히 우리나라)는 어떻게 될지...
중요 포인트!!
1. 구조를 설계할 때 절대 CSS핵 위주로 설계하지 말 것.
2. 단발성 CSS 핵보다는 패스필터 사용 권장.
3. CSS핵은 어쩔 수 없는 경우에만 사용할 것. http://kaludin.egloos.com/967831
by Anna 안나 2008. 7. 11. 23:23
참고사이트
http://bebop.emstone.com/projects/programming_rules/using_doxygen/
http://www.stack.nl/~dimitri/doxygen/index.html

Doxygen 사용법 by 양선진 ? 최종 수정일: 2007-02-20 18:46 Contents 특징 프로그램 사용방법 코드 문서화하기 태그 및 명령어 지원 에디터 참조 사이트 Doxygen은 C++, Java, IDL(Corba, Microsoft and KDE-DCOP flavors), C를 위한 문서 시스템이다. 특징 이 시스템은 소스 코드로 부터 온라인 문서(HTML), 오프라인 문서(Latex)를 생성하며, RTF(MS-Word), PostScript-x, Hyperlinked PDF, Compressed HTML 그리고 Unix man page 문서를 생성한다. 또한 비구조화된 소스 코드로 부터 코드의 구조를 추출해 낼 수 있으며, 의존선 그래프, 상속 다이어그램, 집합 다이어그램 등을 자동으로 생성한다. 프로그램 doxygen : 소스를 파싱하고 문서를 생성하는 주 프로그램 doxytag : doxygen 으로 생성한 외부 문서를 참조하거나 검색 엔진용 인덱스를 생성하기 위해 사용 doxysearch : 검색 엔진을 사용하기 위해 필요한 프로그램 doxywizard : doxygen 을 사용하기 위한 설정 파일을 조작하기 위한 GUI 프론트엔드 사용방법 doxygen 설정 하나 하나와 프로그램 실행 방법을 설명하는 것보다는, GUI 방식으로 설정과 생성 작업을 동시에 할 수 있는 doxywizard 사용을 권한다. 참고로 doxywizard 의 툴바에는 ? 명령이 있는데 이 버튼을 누르고 궁금한 항목을 클릭하면 도움말이 자세하게 나온다. 코드 문서화하기 기본적으로 Doxygen은 다음과 같은 주석을 문서의 일부로 인식한다./** - ... text ...( JavaDoc style ) -/ /*! - ... text ... ( Qt style ) -/ /*! ... text ... -/ /// /// ... text ... /// //! //! ... text ... //! /////////////////////////////////////// /// ... text ... /////////////////////////////////////// 하지만, 일관성을 위해 JavaDoc 형식을 사용할 것을 권한다. 모든 설명은 간략(brief)과 상세(detailed)로 나뉘어진다. 이렇게 나뉘는 이유는 문서를 생성할때 목차나 구조상 단계를 나눌때 사용할 설명을 구분하기 위해서다. 이를 위해 Doxygen은 두 가지 방법을 제공한다. 첫번째 방법은 명시적으로 brief 태그를 붙이는 경우이다. 이때 간략 설명과 상세 설명은 공백라인을 기준으로 구분한다./*! brief Brief descript-xion - Brief descript-xion continued. - - Detailed descript-xion start here. -/ 하지만 JavaDoc 스타일을 사용하거나 설정에서 JAVADOC AUTOBRIEF YES 를 사용하면 처음 나오는 점(.)을 기준으로 구분한다. 가능하면 이 방법을 사용할 것을 권한다./** Brief descript-xion which ends at this dot. Details follow - here. -/ --------------------------------------------------------------- /// Brief descript-xion which ends at this dot. Details follow /// here. 주석이 한 라인을 넘지 않을 경우 다음과 같은 방법을 사용할 수도 있다./// Brief descript-xion /** Detailed descript-xion or //! Brief descript-xion <-- separate blank line( using JAVADOC AUTOBRIEF NO ) //! Detailed descript-xion //! starts here 다음과 같은 방법은 사용할 수 없다.//! Brief descript-xion, which is //! really a detailed descript-xion since it spans multiple lines. /*! Oops, another detailed descript-xion! -/ 다음은 JavaDoc 형식을 이용한 전체적인 문서화 예제이다./** * A test class. A more elaborate class descript-xion. *-/ class Test { public: /** * An enum. * More detailed enum descript-xion. */ enum SampleEnum { SAMPLE_VAL1, /**< Enum value SAMPLE_VAL1.-/ SAMPLE_VAL2, /**< Enum value SAMPLE_VAL2.-/ SAMPLE_VAL3 /**< Enum value SAMPLE_VAL3.-/ } *enum_ptr, /**< enum pointer. Details.-/ enum_var; /**< enum variable. Details.-/ /** * A constructor. * A more elaborate descript-xion of the constructor. */ Test(); /** * A destructor. * A more elaborate descript-xion of the destructor. */ ~Test(); /** * a normal member taking two arguments and returning an integer value. * * @param a an interger argument. * @param s a constant character pointer. * @see Test() * @see ~Test() * @see test_me_too() * @see public_var() * @return The test results */ int test_me(int a, const char-s); /** * A pure virtual member. * * @see test_me() * @param c1 the first argument. * @param c2 the second argument. */ virtual void test_me_too(char c1, char c2) 0; /** * a public variable. * Details. */ int public_var; private: /** * a function variable. * Details. */ int (*handler)(int a, int b); }; 태그 및 명령어 struct union enum fn var def file namespace package interface 지원 에디터 아직까지 찾아낸 건 Emacs 뿐이다. doxymacs 라는 데비안 패키지를 설치하면 아주 편하게 Doxygen 문법으로 주석을 작성할 수 있다. 예를 들어 함수 이름 앞에 커서를 두고 Ctrl-c-d-f 를 입력하면 자동으로 함수의 인수를 추출해 함수 주석 템플릿을 만들어 주고 커서를 위치시킨다. 참조 사이트 http://www.gpgstudy.com/gpgiki/DoxygenTutorial RTF 가 깨지는 문제등에 대한 해답이 있음.
by Anna 안나 2008. 7. 11. 21:21