HOME LIBRARY INVENTORY WALLPAPER GAME LINK BLOG LINK
박스 태그 - 이미지 배경
지난 번 박스 태그의 새 버전입니다.
이글루스 스킨에서 사용되는 이미지를 배경으로 적용한 박스입니다.

사용자 편집 스킨을 사용할 경우에만 가능한 방법으로, 이글루스 기본 스킨을 쓸 경우에는 기존의 방법을 참고하여 직접 손을 보셔야 합니다.

글을 올릴때 박스를 쓰고 싶은 곳에서 다음 태그를 사용합니다.
<DIV CLASS=BOXIMAGE1> 내용 </DIV>
<DIV CLASS=BOXIMAGE2> 내용 </DIV>
<DIV CLASS=BOXIMAGE3GRAY> 내용 </DIV>
<DIV CLASS=BOXIMAGE3YELLOW> 내용 </DIV>
<DIV CLASS=BOXIMAGE3RED> 내용 </DIV>
<DIV CLASS=BOXIMAGE3BLUE> 내용 </DIV>
<DIV CLASS=BOXIMAGE3GREEN> 내용 </DIV>

자신의 스킨 CSS에 다음을 추가합니다. (드래그해서 복사→CSS 편집창에 붙이기)
DIV.BOXIMAGE1 {
    COLOR: BLACK;
    BACKGROUND-IMAGE : URL(http://md.egloos.com/skn/img/a/01/01/2/bg_1.gif);
    BORDER-COLOR: SILVER;
    BORDER-WIDTH: 1PX;
    BORDER-STYLE: DOTTED;
    WIDTH: 100%;
    TEXT-ALIGN: LEFT;
    PADDING: 9PX;
}

DIV.BOXIMAGE2 {
    COLOR: BLACK;
    BACKGROUND-IMAGE : URL(http://md.egloos.com/skn/img/a/01/01/2/bg_2.gif);
    BORDER-COLOR: LIGHTSKYBLUE;
    BORDER-WIDTH: 1PX;
    BORDER-STYLE: DOTTED;
    WIDTH: 100%;
    TEXT-ALIGN: LEFT;
    PADDING: 9PX;
}

DIV.BOXIMAGE3GRAY {
    COLOR: BLACK;
    BACKGROUND-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg1.gif);
    BORDER-COLOR: GRAY;
    BORDER-WIDTH: 1PX;
    BORDER-STYLE: DOTTED;
    WIDTH: 100%;
    TEXT-ALIGN: LEFT;
    PADDING: 9PX;
}

DIV.BOXIMAGE3YELLOW{
    COLOR: BLACK;
    BACKGROUND-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg2.gif);
    BORDER-COLOR: TAN;
    BORDER-WIDTH: 1PX;
    BORDER-STYLE: DOTTED;
    WIDTH: 100%;
    TEXT-ALIGN: LEFT;
    PADDING: 9PX;
}

DIV.BOXIMAGE3RED{
    COLOR: BLACK;
    BACKGROUND-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg3.gif);
    BORDER-COLOR: INDIANRED;
    BORDER-WIDTH: 1PX;
    BORDER-STYLE: DOTTED;
    WIDTH: 100%;
    TEXT-ALIGN: LEFT;
    PADDING: 9PX;
}

DIV.BOXIMAGE3BLUE{
    COLOR: BLACK;
    BACKGROUND-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg4.gif);
    BORDER-COLOR: LIGHTSKYBLUE;
    BORDER-WIDTH: 1PX;
    BORDER-STYLE: DOTTED;
    WIDTH: 100%;
    TEXT-ALIGN: LEFT;
    PADDING: 9PX;
}

DIV.BOXIMAGE3GREEN{
    COLOR: BLACK;
    BACKGROUND-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg5.gif);
    BORDER-COLOR: GREEN;
    BORDER-WIDTH: 1PX;
    BORDER-STYLE: DOTTED;
    WIDTH: 100%;
    TEXT-ALIGN: LEFT;
    PADDING: 9PX;
}

참고로 위 스타일 태그는 더 짧게 줄일 수 있는 여지가 있지만, 프로그래머의 입장에서 짧은 코드보다는 읽기 좋은 코드를 선호하기 때문에 각각의 스타일 이름만으로 용도를 확실히 알 수 있는 명시적인 방식을 사용하고 있습니다.
by Moo!! | 2004/04/09 13:22 | 블로그 관련 | 트랙백(9) | 핑백(1) | 덧글(34)
트랙백 주소 : http://mooo.egloos.com/tb/430910
☞ 내 이글루에 이 글과 관련된 글 쓰기 (트랙백 보내기) [도움말]
Tracked from RainHolic at 2004/04/12 04:09

제목 : 박스태그 사용하는 법
박스 태그 - 이미지 배경 할 줄 모르니까, 그냥 퍼왔다. 이글루스엔 멋진 사람들이 많아서 콩고물이 후두둑!! ^^ ...more

Tracked from [무례한코코아] 이글루.. at 2004/04/14 23:14

제목 : 박스태그 자료용:-)
박스 태그 - 이미지 배경 자료...more

Tracked from Ben's thousa.. at 2004/06/03 02:40

제목 : 박스넣기~
박스 태그 - 이미지 배경아하 좋은 정보!...more

Tracked from 꿈꾸는 물병자리 at 2004/06/04 16:45

제목 : 박스 태그라네요^0^
박스 태그 - 이미지 배경 한번 테스트해볼까요?^^ 난 태그초보라서 이런건 꼭 저장해둬야됩니다...- -;;;...more

Tracked from TAMAYA TIMES at 2004/08/13 01:09

제목 : 이미지글박스
박스 태그 - 이미지 배경...more

Tracked from TAMAYA TIMES at 2004/08/14 02:30

제목 : 이미지 글 박스
박스 태그 - 이미지 배경 MOO!!님의 블로그에서 가져왔습니다. ...more

Tracked from Life of Vale.. at 2004/09/12 12:38

제목 : 박스 넣는 방법
Moo!!님의 박스 태그 - 이미지 배경 넣는 방법에 관한 포스트 한번 사용해 보세요. ^^...more

Tracked from Life of Vale.. at 2005/09/11 23:03

제목 : 박스 태그 사용하는 법
박스 태그 - 이미지 배경 DIV.BOXIMAGE1 { COLOR: BLACK; BACKGROUND-IMAGE : URL(http://md.egloos.com/skn/img/a/01/01/2/bg_1.gif); BORDER-COLOR: SILVER; BORDER-WIDTH: 1PX; BORDER-STYLE: DOTTED; WIDTH: 100%; TEXT-ALIGN:......more

Tracked from 서기장 사생아의 비밀공.. at 2006/02/12 20:00

제목 : 박스 태그 - 이미지 배경
박스 태그 - 이미지 배경 ...more

Linked at 지옥에서 도망가는 마차에 올라.. at 2008/06/09 02:11

... 박스태그. mooo님 블로그 1 2 3 &lt;div style="color:black; background-color:#eeeeee; border-color:#dddddd; text-align:left; p ... more

Commented by 시대유감 at 2004/04/09 14:19
오오, 감사합니다! 좋은 정보군요.
.. 그렇지만 스킨 에디트의 귀차니즘과 인테리어도 제대로 못 하고 있는 게으름뱅이라.
Commented by Moo!! at 2004/04/09 14:35
^^;
Commented by Sori at 2004/04/09 15:31
이글루스를 더 잘 쓰고 싶다는 욕심을 가지게 된 초짜입니다.
우연히 발견한 Moo님의 블로그에서 많은 것을 배울 수 있을 것 같네요.
링크해도 되겠습니까??
Commented by Moo!! at 2004/04/09 15:35
링크 당연히 됩니다. 저두 몰래 링크하고 있으니.. ^^;
Commented by Sori at 2004/04/09 15:40
감사합니다.
앞으로 스승님으로 모실게요 ^^
Commented by Moo!! at 2004/04/09 15:48
에구.. 저는 이런 쪽은 아주 가끔 글을 올립니다. ^^;
블로그 편집 관련 글은 비둘기님 블로그에 더 많으니 가보세요.
http://memo.egloos.com/
Commented by Sori at 2004/04/09 17:35
네, 그쪽도 참고하겠습니다 ^^
Commented by 잠본이 at 2004/04/09 17:43
오오 훌륭합니다. 그러잖아도 박스가 몇개(?) 필요했는데.
Commented by 알트아이젠 at 2004/04/09 18:43
우와! 감사합니다. ^_^
Commented by 미르 at 2004/04/09 22:53
유익한정보군요^^
...실제로 제가 써먹을지도는 미지수입니다만(.....게으름뱅이)
Commented by Moo!! at 2004/04/10 00:29
^^;
Commented by 호야 at 2004/04/10 01:04
^^ 감사합니다. 잘쓰겠습니다.
Commented by 카샤 at 2004/04/10 13:54
헤에. 이거 좋은 정보인걸요? 감사드립니다(__)
Commented by 프리니아토레 at 2004/04/10 14:55
우와~ 감사~
...그러나 비닐우산님처럼 저도 귀차니즘의 압박이 우선일지도;;;
Commented by shiningsaver at 2004/04/10 20:20
감사합니다. 매번 편집하기 귀찮아서 안썼는데 이렇게 올려주시니^^
Commented by Sensui at 2004/04/10 23:10
이 배경 역시 많은 사람들이 쓸 경우에는 로딩시간이 늘어날 수 도 있나요?
Commented by Moo!! at 2004/04/11 00:53
이 배경으로 사용되는 이미지는 파일 크기도 작고, 이글루스에서 원래 배경으로 사용하기 때문에 큰 로딩이 있지는 않을겁니다.
Commented by Sori at 2004/04/12 04:08
이글 좀 퍼가겠습니다 ^^
Commented by Moo!! at 2004/04/12 10:52
네.. ^^
Commented by Sori at 2004/04/12 12:56
Moo!!님 ^-^
덕분에 이쁘게 꾸밀 수 있었답니다. 감사합니다! (꾸벅)

그런데 질문거리가 하나 있어요.
여기저기 다니면서 조 위에도 있는 링크에 점선밑줄이
눈에 쏘옥 들어오고 굉장히 궁금했거든요.
저것도 어떻게 하는 건지 가르쳐주시면 안될까요? ^^
Commented by 월랑아 at 2004/04/12 12:57
좋은 정보 감사합니다^^
Commented by Kenny at 2004/04/12 13:04
무~님.. 좋은 자료 감사합니다.. 블로그가 더 멋있어졌네요.. ^^
Commented by Moo!! at 2004/04/12 13:26
좋아하시니 기분이 좋네요. ^^
Commented by PHILL at 2004/04/22 06:40
너무 멋지네요. 행복한 4월을 마무리 잘 하시길....
Commented by Moo!! at 2004/04/22 11:16
네 ^^
Commented by 이상훈 at 2004/05/22 14:30
가지갑니다. =) thx
Commented by 카본 at 2004/05/29 15:07
앗! 환상적인 박스네요. 감사히 잘 쓰겠습니다.
Commented by 잰짱 at 2004/06/03 00:46
저도 받아가겠습니다, 그동안 박스태그 불편해서 잘 안썼는데 이제 좀 포스트가 깔끔해지겠어요^^
Commented by 쑤야 at 2004/06/04 16:42
와..대단..하십니다..저도 퍼갈게요..근데 퍼가기 버튼이어딧지?-_- 네이버블로그 하다가 어제 옮겼는데요...글작성하기 너무힘드네요 태그를 몰라서..네이버는 그냥 색깔도 버튼만 누르면 되는데 색깔태그도 여기선 직접 써야되는거져?-_-;;암튼 잘구경하고갑니다..^^
Commented by procol at 2004/09/12 12:35
퍼갑니다요~
Commented by 스티치 at 2004/09/12 13:08
이거 이글루스뿐 아니라 테터에도 잘 적용이 되는군요^^
은밀히 배껴갑니다.
Commented by 고사리 at 2004/09/28 15:10
이야 정말 이쁘네요 잘써먹어도 되죠?
Commented by 허밍 at 2004/12/28 15:39
우와 멋집니다..^^ 뒷북이지만서도!! 잘 구경하고 갑니다..^^
Commented by 리드 at 2005/10/15 07:10
Moo!!님의 블로그를 구경할 때마다 항상 써 보고 싶다는 생각이 들었던 점선 박스였는데, 이렇게 편리하게 정리된 글이 있었군요~ 저같은 html 초보자에게는 정말 각별한 도움이 됩니다. 감사합니다.^^;
Commented by Dreamcat at 2006/05/07 17:41
정말 감사드립니다. 기초상식도 없으면서 많이 배껴갑니다^^
※ 로그인 사용자만 덧글을 남길 수 있습니다.
◀ 이전 페이지 다음 페이지 ▶
이글루스 | 로그인
라이프로그
마법의 크리스탈
마법의 크리스탈

메모장
이글루 파인더

최근 등록된 덧글
2013년 새해 복 많이 받..
by DAIN at 01/01
2012년 새해 복 많이 받..
by DAIN at 01/01
^^;;
by Moo!! at 08/24
웰컴백~
by 하이드린 at 08/24
네이버 블로그에 쓰겠습..
by 은설 at 02/04
글과 관련없은 댓글하나..
by 쩌비 at 01/02
푸하하하핫!! 역시 Moo..
by Auss at 09/11
최근 등록된 트랙백
nike free 5.0
by ipad ケース //t.qq.co..
コーチ 正規品
by toms skor rea
존군이 추천하는 블로그..
by 피곤한 존과 더 피곤한 ..
카테고리
전체
게임 이야기
게임 패키지
만화 & 애니메이션
무단인용
일상 & 잡담
읽을꺼리
영화
시사
블로그 관련
인터넷 관련
아이템 창고
미분류
rss

skin by Moo!!
Google