HTML-ben készített background-ot hogyan lehet átmásolni?
Konkrétan készítettem egy e-mail aláírást, amit a gmail alírás részbe szeretnék beilleszteni. Másolás beillesztéssel behelyezi az egészet, úgy ahogy van szépen (képet is szöveget is úgy elrendezve, ahogy kell), de a background imege-t nem... :(
Az indx.html és az images mappa a google drive-on vannak onnan jelenítem meg és másolom be.
A g-mailbe beilleszthető e-mail aláírásnak (ami HTML formátumú)
Ennek a mintájára:
https://www.youtube.com/watch?v=ajaDBAXkxW0&t=547s
Ezzel a módszerrel:
https://www.youtube.com/watch?v=3g5f4CNN8Yg
Sajnos az 1. videóban nem mutatja, hogyan illeszti be, de lelehetett hozzá tölteni az indx.html-t és a képeket. és onnan bemásolva kipróbáltam a 2. videóban látott módszerrel, és a background-al együtt ment át.
Amikor én próbálkoztam egy általam készített e-mail aláírással, akkor nekem is minden szépen átment, csak a háttérképem nem.
Pedig megvizsgáltam az 1. videóhoz megadott index.html-t a böngészőben, de ott nem látok semmi olyan kódot, amit én kihagytam volna. Szóval nem tudom hogy nekem miért nem megy át a háttér is :(





Én is gondolkodtam már csak képben, de azt is meg kell valahogy oldani, hogy kattinthatók legyenek a linkek (pl.: weboldalcím, facebook oldal stb.) Legalább is én ilyen e-mail aláírásra gondoltam.
A HTML és CSS-el elboldogulok (főleg, ha van róluk videó, vagy letölthető anyag) de az átkódolom base64-be nem biztos hogy menne :)
Na meg mindntől függetlenül azért jó lenne tudni, hogy a videón látható e-mail aláírást miért lehet háttérképpel együtt beilleszteni, amit pedig csináltam azt nem.





Háát.... nem akarok ünneprontó lenni, de ezt úgy, hogy rendesen meg is jelenjen mindenhol, nem fogod tudni megoldani.
De talán nem is kéne ezzel bajlódni. Nem véletlen, hogy az e-mailek jelentős része még manapság is plain-text. A célja az, hogy szöveges információt juttassunk a címzetthez, akinek a megjelenítőjéről semmit nem tudunk, még az sem garantált, hogy az képes HTML formázások megjelenítésére. Vagy ha képes rá, nem lehetsz biztos benne, hogy ugyanúgy fog minden formázást megjeleníteni, mint nálad. Az is lehet, hogy a címzettnél például le vannak tiltva a képek. Természetesen ha szeretnéd, lehet feszegetni a technika korlátait, de nem biztos, hogy megéri. Elegánsabb és jobb megoldás szöveges formátumban feltüntetni azt, amit feltétlenül közölni akarsz az "aláírásban", vagy esetleg mellé/helyette egy képet, bár lehet, hogy az sem fog mindenhol megjelenni. A levelek HTML-formázását meg nem azért alkották meg, hogy azzal te e-mail helyett komplex weboldalakat küldj, hanem azért, hogy ha szükségét érzed, akkor a feltétlenül lényeges elemeket meg tudd formázni.










table szerkezetet javaslom és attribútumnak a background=" [link] ahol a kép elérése van.
utána CSS -el tudod még igazgatni a képet, de nem mindig fogadja el, ha style -ba van a kép.
Így néz ki a html:
(css formázás még nincs sok helyen megadva, ez inkább egy próba lenne, de a kérdés szempontjából, gondolom ez nem is számít)





teljes elérések legyenek, web címmel (https), ahonnan kívülről elérhető.
és figyelj a kis - nagy betűkre a kép elérésében.





A csávó úgy illeszti be, hogy megnyitja böngészőben, nyom egy Ctrl-A -t (minden kijelölése), a levélben pedig egy Ctrl-V -t. Ez így működik.
Ha a képeket úgy illeszted be a levélbe, hogy 'src="images/fenykep.jpg"', az nem fog működni, mert nem adtál meg gyökér URI-t. A levelezőprogramnak fogalma sem lesz, hogy az "images" mappát hol keresse. Egyébként sem kellene email aláírásba külső képeket rakni, mert azokat sok program vagy nem tölti be, vagy csak kérdezés után tölti be
A kódodban a twitter.png-nél nincs lezárva a az <img>.
Kapcsolódó kérdések:
Minden jog fenntartva © 2025, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!