홈페이지 메인에서..
최신글스킨 사이에 선 이미지로 나누어서 분리해주려는데.
예로.. <div><? latest.("1" "2" 5,35); ?></div>
-->사이에 <img src="line.gif">
<div><? latest.("1" "2" 5,35); ?></div>
여기서.. 라인 이미지를 여러개 넣어줄거라서...
<style type/css>안에
.line { background:url("ling.gif") ;}
를 넣어주고..
index에서 img src=.... 부분에 <div class="line"></div>
해주는데... 라인 이미지가 안나오네요..
img src=""는 여러개 넣어줘도 잘나오는데요..
초보적인 질문이라도 무시하지마시고 답변좀 부탁드릴께요
댓글 4개
13년 전
div.line { background:url("/절대경로로 적확하게ling.gif") no-repeat left top; width:라인폭만큼px; height:라인높이만큼px;}
13년 전
윗분 답변글중에서 no-reoeat가 아니라 repeat-x로 해야 할것 같은데요...
라인이면 배경이미지가 고정이 되면 안되지 않나요?.
그리고 라인을 긋는 의미라면, border-bottom을 이용해서 라인을 생성 하시는게 더 쉽지 않을까 생각 해봅니당~~
라인이면 배경이미지가 고정이 되면 안되지 않나요?.
그리고 라인을 긋는 의미라면, border-bottom을 이용해서 라인을 생성 하시는게 더 쉽지 않을까 생각 해봅니당~~
13년 전
차츰내게님과 새벽비님 답변 감사드립니다.
새벽비님 말씀처럼 border-bottem을 넣으면 좋겠지만..
그림자 있는 입체감있는 라인으로 넣으려는데..
style로 이미지 추가해넣어도 안나오더군요. 그냥 배경이미지로 인식하는듯요.
그리고 이미지 한개 넣을때는 repeat-x 해주면 안되요 ^^;
no-repeat이 정상이네요 짧은것을 반복으로 늘릴때.. repeat-x 넣어주죠,
새벽비님 말씀처럼 border-bottem을 넣으면 좋겠지만..
그림자 있는 입체감있는 라인으로 넣으려는데..
style로 이미지 추가해넣어도 안나오더군요. 그냥 배경이미지로 인식하는듯요.
그리고 이미지 한개 넣을때는 repeat-x 해주면 안되요 ^^;
no-repeat이 정상이네요 짧은것을 반복으로 늘릴때.. repeat-x 넣어주죠,
13년 전
아래와 같은 예제를 첨부하니 실행해보시고 참고하시기 바랍니다.
소스를 천천히 보시면 이미지를 배경으로 쓰는 것과 한 장의 이미지를 삽입하는 명령어와 방법은 다르며 결과 또한 다릅니다. 첨부한 소스 중에 아래의 소스를 변경해보며 테스트를 해보시면 이해가 더욱 쉬울 것입니다.
- 예제 -
<style type="text/css">
.line {height: 10px; background-image: url(http://img.sir.co.kr/programmer/menubar_bg.gif); background-repeat: repeat-x; height: 10px;}
</style>
<body>
<div><? latest.("1" "2" 5,35); ?></div>
<div class="line"></div>
<div><? latest.("1" "2" 5,35); ?></div>
<div><img src="http://egreenworld.co.kr/GW12/img/article/articleAintro_03.gif" alt="테스트이미지"></div>
- 예제끝 -
- 아래 -
.line {height: 10px; background-image: url(http://img.sir.co.kr/programmer/menubar_bg.gif); background-repeat: repeat-x; height: 10px;}
- 아래끝 -
위의 소스 중 background-repeat: repeat-x; / height: 10px; 부분을
no-repeat :/ repeat; / repeat-x; / repeat-y; 등 과 height: 10px; 의 높이 값의 변화를 주면서 실행해보시면 많은 도움이 될 것으로 판단합니다.
소스를 천천히 보시면 이미지를 배경으로 쓰는 것과 한 장의 이미지를 삽입하는 명령어와 방법은 다르며 결과 또한 다릅니다. 첨부한 소스 중에 아래의 소스를 변경해보며 테스트를 해보시면 이해가 더욱 쉬울 것입니다.
- 예제 -
<style type="text/css">
.line {height: 10px; background-image: url(http://img.sir.co.kr/programmer/menubar_bg.gif); background-repeat: repeat-x; height: 10px;}
</style>
<body>
<div><? latest.("1" "2" 5,35); ?></div>
<div class="line"></div>
<div><? latest.("1" "2" 5,35); ?></div>
<div><img src="http://egreenworld.co.kr/GW12/img/article/articleAintro_03.gif" alt="테스트이미지"></div>
- 예제끝 -
- 아래 -
.line {height: 10px; background-image: url(http://img.sir.co.kr/programmer/menubar_bg.gif); background-repeat: repeat-x; height: 10px;}
- 아래끝 -
위의 소스 중 background-repeat: repeat-x; / height: 10px; 부분을
no-repeat :/ repeat; / repeat-x; / repeat-y; 등 과 height: 10px; 의 높이 값의 변화를 주면서 실행해보시면 많은 도움이 될 것으로 판단합니다.
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 8130 | 9년 전 | 460 | ||
| 8129 |
 Angelos |
9년 전 | 626 | |
| 8128 | 9년 전 | 496 | ||
| 8127 |
Angelos |
9년 전 | 559 | |
| 8126 | 9년 전 | 491 | ||
| 8125 | 9년 전 | 749 | ||
| 8124 |
Angelos |
9년 전 | 480 | |
| 8123 | 9년 전 | 465 | ||
| 8122 | 9년 전 | 402 | ||
| 8121 | 9년 전 | 510 | ||
| 8120 | 9년 전 | 442 | ||
| 8119 | 9년 전 | 523 | ||
| 8118 |
Angelos |
9년 전 | 607 | |
| 8117 |
 뜨거운형제들 |
9년 전 | 381 | |
| 8116 |
PASKRAN
|
9년 전 | 450 | |
| 8115 | 9년 전 | 442 | ||
| 8114 |
kiplayer
|
9년 전 | 584 | |
| 8113 | 9년 전 | 415 | ||
| 8112 |
Angelos |
9년 전 | 531 | |
| 8111 | 9년 전 | 382 | ||
| 8110 | 9년 전 | 424 | ||
| 8109 | 9년 전 | 334 | ||
| 8108 |
Angelos |
9년 전 | 523 | |
| 8107 |
Angelos |
9년 전 | 414 | |
| 8106 |
Angelos |
9년 전 | 409 | |
| 8105 | 9년 전 | 456 | ||
| 8104 |
Angelos |
9년 전 | 406 | |
| 8103 |
Angelos |
9년 전 | 408 | |
| 8102 |
Angelos |
9년 전 | 359 | |
| 8101 |
snshero
|
9년 전 | 750 | |
| 8100 | 9년 전 | 817 | ||
| 8099 | 9년 전 | 781 | ||
| 8098 | 9년 전 | 692 | ||
| 8097 | 9년 전 | 481 | ||
| 8096 | 9년 전 | 683 | ||
| 8095 | 9년 전 | 799 | ||
| 8094 | 9년 전 | 475 | ||
| 8093 | 9년 전 | 774 | ||
| 8092 | 9년 전 | 735 | ||
| 8091 | 9년 전 | 1126 | ||
| 8090 | 9년 전 | 735 | ||
| 8089 | 9년 전 | 942 | ||
| 8088 | 9년 전 | 615 | ||
| 8087 | 9년 전 | 721 | ||
| 8086 | 9년 전 | 494 | ||
| 8085 | 9년 전 | 457 | ||
| 8084 | 9년 전 | 600 | ||
| 8083 | 9년 전 | 569 | ||
| 8082 | 9년 전 | 735 | ||
| 8081 | 9년 전 | 446 | ||
| 8080 | 9년 전 | 532 | ||
| 8079 | 9년 전 | 489 | ||
| 8078 | 9년 전 | 419 | ||
| 8077 | 9년 전 | 495 | ||
| 8076 | 9년 전 | 384 | ||
| 8075 | 9년 전 | 398 | ||
| 8074 | 9년 전 | 365 | ||
| 8073 | 9년 전 | 416 | ||
| 8072 | 9년 전 | 405 | ||
| 8071 |
o1o111
|
9년 전 | 856 | |
| 8070 | 9년 전 | 374 | ||
| 8069 | 9년 전 | 303 | ||
| 8068 | 9년 전 | 567 | ||
| 8067 | 9년 전 | 374 | ||
| 8066 | 9년 전 | 402 | ||
| 8065 | 9년 전 | 353 | ||
| 8064 | 9년 전 | 333 | ||
| 8063 | 9년 전 | 294 | ||
| 8062 | 9년 전 | 285 | ||
| 8061 | 9년 전 | 331 | ||
| 8060 | 9년 전 | 352 | ||
| 8059 | 9년 전 | 285 | ||
| 8058 | 9년 전 | 225 | ||
| 8057 | 9년 전 | 350 | ||
| 8056 | 9년 전 | 279 | ||
| 8055 | 9년 전 | 312 | ||
| 8054 | 9년 전 | 330 | ||
| 8053 | 9년 전 | 370 | ||
| 8052 | 9년 전 | 258 | ||
| 8051 | 9년 전 | 303 | ||
| 8050 | 9년 전 | 367 | ||
| 8049 | 9년 전 | 288 | ||
| 8048 | 9년 전 | 401 | ||
| 8047 | 9년 전 | 336 | ||
| 8046 | 9년 전 | 263 | ||
| 8045 | 9년 전 | 237 | ||
| 8044 | 9년 전 | 300 | ||
| 8043 | 9년 전 | 241 | ||
| 8042 | 9년 전 | 268 | ||
| 8041 | 9년 전 | 306 | ||
| 8040 | 9년 전 | 238 | ||
| 8039 | 9년 전 | 299 | ||
| 8038 | 9년 전 | 251 | ||
| 8037 | 9년 전 | 363 | ||
| 8036 | 9년 전 | 449 | ||
| 8035 | 9년 전 | 402 | ||
| 8034 | 9년 전 | 364 | ||
| 8033 | 9년 전 | 319 | ||
| 8032 | 9년 전 | 370 | ||
| 8031 | 9년 전 | 309 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기