| 문제 페이지 주소 | 비공개 (작성 후 5일 경과) |
|---|
먼저 개발자가 아니라 이런 질문 남기는 걸 이해 바랍니다.
이미지를 분할해서 링크를 넣을려고 포토샵에서 1차 작업하고, html 파일로는 이미지가 정상적으로 출력됩니다.
원래는 이런 이미지이고, 각 이름에 링크를 걸어놨습니다.
xe 게시판에서 html 소스를 복사하고 확인해보면 이렇게 이미지 간격이 벌어지는 문제가 있습니다.
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><!-- Save for Web Slices (Seoul.psd) -->
<table border="0" cellpadding="0" cellspacing="0" height="868" id="Table_01" width="651">
<tbody>
<tr>
<td colspan="15"><img alt="" height="219" src="http://musote.cdn3.cafe24.com/senn/Seoul_01.jpg" width="650" /></td>
<td><img alt="" height="219" src="http://musote.cdn3.cafe24.com/senn/spacer.gif" width="1" /></td>
</tr>
<tr>
<td colspan="7"><img alt="" height="104" src="http://musote.cdn3.cafe24.com/senn/Seoul_02.jpg" width="220" /></td>
<td colspan="2" rowspan="2"><a href="http://www.earphoneshop.co.kr/shop/shopbrand.html?type=N&xcode=121&mcode=051" target="new tab"><img alt="" border="0" height="105" src="http://musote.cdn3.cafe24.com/senn/Seoul_03.jpg" width="135" /></a></td>
<td colspan="6" rowspan="3"><img alt="" height="145" src="http://musote.cdn3.cafe24.com/senn/Seoul_04.jpg" width="295" /></td>
<td><img alt="" height="104" src="http://musote.cdn3.cafe24.com/senn/spacer.gif" width="1" /></td>
</tr>
<tr>
<td colspan="2" rowspan="5"><img alt="" height="191" src="http://musote.cdn3.cafe24.com/senn/Seoul_05.jpg" width="65" /></td>
<td colspan="3" rowspan="3"><a href="http://www.catsline.co.kr/product/search.html?banner_action=&keyword=sennheiser" target="new tab"><img alt="" border="0" height="69" src="http://musote.cdn3.cafe24.com/senn/Seoul_07.jpg" width="128" /></a></td>
<td colspan="2" rowspan="7"><img alt="" height="297" src="http://musote.cdn3.cafe24.com/senn/Seoul_07-08.jpg" width="27" /></td>
<td><img alt="" height="1" src="http://musote.cdn3.cafe24.com/senn/spacer.gif" width="1" /></td>
</tr>
<tr>
<td colspan="2" rowspan="7"><img alt="" height="356" src="http://musote.cdn3.cafe24.com/senn/Seoul_08.jpg" width="135" /></td>
<td><img alt="" height="40" src="http://musote.cdn3.cafe24.com/senn/spacer.gif" width="1" /></td>
</tr>
<tr>
소스는 이런 형태인데, 해결 방법이 없을까요?? ㅠㅠ
 |
 |
||||||||||||||
 |
 |
 |
|
||||||||||||
 |
 |
 |
|
||||||||||||
 |
|
||||||||||||||
 |
 |
 |
|
||||||||||||
 |
|
||||||||||||||
 |
|
||||||||||||||
 |
 |
 |
|
||||||||||||
 |
|
||||||||||||||
 |
 |
 |
 |
 |
 |
|
|||||||||
 |
 |
 |
|
||||||||||||
 |
 |
|
|||||||||||||
 |
|
||||||||||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
![스크린샷 2018-07-05 오후 5.23.47.png [File Size:292.7KB/Download:9]](/files/download/link/1013335/1ba21f650787568273d7ad28e4f4c4b7/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202018-07-05%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%205.23.47.png){kind=link}
![스크린샷 2018-07-05 오후 5.24.13.png [File Size:259.7KB/Download:6]](/files/download/link/1013336/764f671d4c32a76fd34010d1625cb744/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202018-07-05%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%205.24.13.png){kind=link}
댓글 12
맨 밑에
<style>
.bTable td {
display: initial;
}
.bTable tr{
display: flex;
}
</style>를 붙여보세요.
사진이 반만 나와있어서 제대로 먹힐지는 모르겠네요.
position:relative 스타일을 가지고 있는 div 안에 a를 넣어서 스타일 속성을 position:absolute를 줘도 됩니다.
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><!-- Save for Web Slices (Seoul.psd) -->
<style type="text/css">.bTable td {
display: initial;
}
.bTable tr{
display: flex;
}
</style>
<table border="0" cellpadding="0" cellspacing="0" height="868" id="Table_01" width="651">
<tbody>
스케치북의 문제인거 같은데, 해결 방법이 없을까요??
게시글 안에 넣으실건가요 아니면 따로 페이지를 만들어서 넣으실 생각이신가요?
필요하시면 첨부파일에 올려드렸던걸 완성해서 드리겠습니다.
게시글안에 넣을 생각입니다.
원본 이미지 파일과 html 파일 첨부해 드립니다.
1.FTP에서 modules/board/skins/sketchbook5/css에 첨부파일에 있는 mapview.png, mapview.css를 업로드하시고
2.modules/board/skins/sketchbook5/_read.html 파일을 열어서 아래에 있는 한줄을 붙여넣기합니다.
<load target="css/mapview.css" />
3.글쓰기를 해서 다음과 같이 입력합니다.
<div class="link_table">
<div class="box">
<img src="/modules/board/skins/sketchbook5/css/mapview.png"></img>
<a href="earphone" class="earphoneshop"/>
<a href="esoriworld" class="esoriworld"/>
<a href="sharkwave" class="sharkwave"/>
<a href="hanyanghihi" class="hanyanghihi"/>
<a href="headphoneshop" class="headphoneshop"/>
<a href="joyaudio" class="joyaudio"/>
<a href="sherazard" class="sherazard"/>
</div>
</div>
테이블은 해결하기 번거로워서 좀 걸립니다.
저렇게 돼있는건 처음보는지라...