HTML 태그를 사용하여 별도의 이미지를 하나의 이미지로 결합

3 개의 이미지가 있으며 하나의 이미지로 표시해야하며 HTML 태그를 사용하여 이미지의 3 부분에 대한 링크를 포함하고 싶습니다.HTML 태그를 사용하여 별도의 이미지를 하나의 이미지로 결합

나는 1 열 2 행으로 테이블을 만들었고 그 이미지를 테이블의 3 섹션에 삽입했습니다. 그러나 위와 아래 이미지 사이에는 약간의 공백이 있습니다 (1 행과 2 행). 어떻게이 문제를 해결하고 공백없이 하나의 그래픽을 만들 수 있으며 또한 세 번째 이미지에 대한 링크를 포함시켜야합니다.

내가 위의 코드를 사용하여 긴급

<table style="width: 660px; border-collapse: collapse; height: 237px;" border="0" cellspacing="0" cellpadding="0" sizset="0" sizcache="15"> 
<tbody sizset="0" sizcache="15"> 
<tr> 
<td><img style="margin: 0px; border: 0px currentColor;" src="uploaded/Online_Newsletters/Nav/masthead-ball_top.jpg" width="665" height="197"></td> 
</tr> 
<tr> 
<td><img style="margin: 0px; border: 0px currentColor;" src="uploaded/Online_Newsletters/Nav/ball_bottom_left.jpg" width="579" height="37"><img style="margin: 0px; border: 0px currentColor;" src="uploaded/Online_Newsletters/Nav/ball_bottom_right.jpg" width="86" height="37"></td> 
</tr> 
</tbody> 
</table>

도움 여전히 이미지 사이의 공간이 필요합니다. 내 회사 웹 사이트에서는 finalsite를 사용하여 관리되므로이 사이트에서는 finalsite 편집기를 사용하고 있습니다. 테이블 태그에

출처

2012-07-02 user1487320

그것은 도움이 될 것이다 - 바람직 http://jsfiddle.net/로를 - 우리가 볼 수 있도록 그것. CSS를 사용하여 이미지를'display : block'으로 설정하려고 할 수도 있습니다 만, 여러분의 질문에서 알 수 있듯이 말입니다. –

http://jsfiddle.net/wLA3T/1/- 코드에 대한 링크 – user1487320

@ PaulD.Waite 거의 20,000 명의 담당자가 대답이 아니라 주석임을 알아야합니다. – casperOne

사용의 cellpadding 및 cellspacing는 :

당신의 IMG 태그에 style="float:left;"을 추가

<table cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">

와 링크로 3 이미지를 사용하는 단지

<a href="http://www.example.com"><img src="yourimage.jpg" border="0" style="float:left;" /></a>

EDIT를 사용합니다. 에서 @ Wolv3r 응답과 함께

http://jsfiddle.net/H628X/1/

출처

2012-07-02 12:37:14 WolvDev

국경 붕괴 : 붕괴를 볼 필요가 있습니다. css 속성을 사용하면 테이블의 각 셀 주위에 테두리가 축소됩니다. –

또는 border = "0"으로 설정하여 이미지의 일부분을 표시하지 못하게하는 경계선이 없도록하십시오. – WolvDev

항상 작동하지는 않지만 나중에 예제를 시도해 보겠습니다. 특정 브라우저 일 수도 있지만 cellpadding 셀 간격과 테두리를 0으로 설정하면 모든 경우에 셀 사이의 간격을 없앨 수 없습니다. 때때로 국경 붕괴의 필요성도 있습니다. –

, 당신은

img { 
    display:block; 
}

인라인 된 또는 사용하여 스타일 태그가없는 경우,이 Gmail을/야후에서 문제가 발생합니다. 이메일을 보내는 방법에 대한 좋은 HTML에 대한

출처 : 당신은 당신이 지금까지 가지고있는 코드를 게시 할 수있는 경우

http://24ways.org/2009/rock-solid-html-emails/

출처

2014-03-03 16:07:13 Zork

HTML 태그를 사용하여 별도의 이미지를 하나의 이미지로 결합

답변

관련 문제