2016-06-26 5 views
1

테두리가있는 div가 있습니다. 그러나 테두리 이미지가 나타나지 않습니다. 일반 솔리드 경계로 표시합니다. 이상하게도 URL은 유효하고 작동하며 Google 드라이브에서 모든 것이 잘 보입니다. HTML 자체는 작동하지만 전자 메일에서 사용할 때는 그렇지 않습니다.테두리 이미지가 HTML로 표시되지 않습니다.

<div style="-webkit-border-image: url(https://s32.postimg.org/rfht7aqx1/border.png) 46px round;-o-border-image: url(https://s32.postimg.org/rfht7aqx1/border.png) 46px round;border-image: url(https://s32.postimg.org/rfht7aqx1/border.png) 46 round;border-width: 46px;border-style: solid;">Hello world!!!</div>

은 정말 이상 하네; 나는 이런 것을 본적이 없다. Gmail BTW로 보내고 Outlook 또는 다른 것과 작동하는지 확실하지 않습니다.

추신 : 조금 이상하게 보입니다. 그 높이가 작기 때문입니다. 나는 그것을 알고 있으므로 그것에 대해 불평하지 마십시오.

+0

는 불행하게도 대부분의 이메일 클라이언트는 Gmail에서 그들 중 하나 인 사물의 이러한 종류를 지원하지 않습니다. 내가 아는 한 실제로 효과적인 대안은 없습니다. – Dev1997

답변

4

실제로 Gmail은 border-image 속성을 지원하지 않습니다. 태그 호환성을 위해 여기

검사 : border-image 이후 https://www.campaignmonitor.com/css/

+0

젠장. 그렇다면 사용할 수있는 서비스가 있습니까? –

+0

또는 테이블에서 테두리를 만드는 방법에 대한 자습서로 나를 연결할 수 있습니까?' 를 [콘텐츠]와이 요소에 콘텐츠를 넣어 ; '<무 1 픽셀의 # E9E9E9 TD 스타일 = "국경을 :> 간단한 테두리가있는 경우 –

+0

, 당신은''요소에 테두리를 사용할 수 있습니다. 그렇지 않으면 테두리 이미지를 얇게 잘라서 표를 사용하여 재현 할 수 있습니다. http://blog.bronto.com/commercemarketing/how-to-build-an-email-using-sliced-images-with-- embarrassing-yourself- or-get-fired/ (모자이크처럼 중앙에 콘텐츠가 있음) – pastorello

1

대부분의 이메일 업체에서 지원되지 않습니다, 당신은 단지 div와 조합 background-image (하나는 Gmail에서 지원되기 때문에) 속성을 사용하여 border-image을 시뮬레이션 할 수 있습니다 또는 당신이 사용하기를 원하는 어떤 다른 요소. div에서 사용하는 경우 padding 속성을 약간 수정해야합니다. 그러나 이것은 내가 어떻게 그것을했는지와 border-image처럼 보입니다. 여기

내 보이는 방법입니다

simulating border-image with a backrounded div