Preskoči na vsebino
TextArray1.41.0
100% lokalno

CSS vgrajevalnik za e-pošto

Prenesiti CSS iz style bloka v inline style atribute, da preživi v e-poštalnih klijentih.

Vhod
Izhod
Povezana orodja
Oblikovalnik CSSOrodja za razvijalce
Oblikovalnik HTMLOrodja za razvijalce
Iskalnik neuprabljenih CSS selektorjevnovoOrodja za razvijalce
i18n tipka difOrodja za razvijalce
Pretvornik TOML v JSONOrodja za razvijalce
SQL v JSONOrodja za razvijalce
CSS vgrajevalnik za e-pošto
Večina e-poštalnih klijentov odstrani ali ignora CSS napisan v <style> bloku — Gmailov spletni vmesnik je najbolj znan primer. Rešitev je prenesti vsako pravilo na element, ki ga cilj kot style="" atribut, in točno to počne to orodje: prilepite HTML s <style> blokom in dobijete isto oznako z vgrajenimi stili, pripravljena za lepljenje v kampanjo ali transakcijski predlog.
Spajanje spoštuje specifičnost CSS selektorjev po privzeto, zato je pravilo kot #footer močnejše od navadnega a tudi če se to pravilo pojavi kasneje v slogu — izključite "Spoštovati specifičnost selektorjev" da spojite le po vrstnem redu virov. Pravila, ki se ne morejo vgraditi — media poizvedbe, :hover, ostala at-pravila — nikoli se niso tiho odstranjena: "Obdržati pravila, ki se ne morejo vgraditi" jih ohrani v okrajšanem <style> bloku, medtem ko "Odstraniti originalni <style> blok" odloči, ali je ta blok sploh izpuščen. "Dodati legacy width/bgcolor atribute" odraža width, height in background-color na navadnih atributih, ki jih pričakujejo starejše Outlook izdaje, "Odstraniti neuporabljene razrede in ID-je" očisti selektorje, ki jih nič več ne skicira, in "Minimizirati izhod" sesede preostale razmake.
Podpora za selektorje pokriva tip, razred, ID in selektorje atributov, skupaj s silaznimi in otročimi kombinatorji — vzorci, ki jih uporabljajo pravi e-poštalnih slog. Lastni obstoječi style="" atribut elementa vedno premaga vse, kar se spaja, kar se ujema s tem, kako brskalniki uporabljajo kaskado. Ko je "Prikazati opozorila o nepodprtih lastnostih" vklopljeno, lastnosti, ki jih mnogi klijenti ignora — float, position: fixed, transformacije, box-shadow — so označene v komentarju na vrhu izlaza, da jih ujamete pred slanjem testa.
Vse se izvršava lokalno v vašem brskalniku: HTML, ki ga prilepite, nikoli ne pošljete nikamor. Kopirajte rezultat, preuzmite kot .txt datoteko ali ga pošljite neposredno v drugo orodje za nadaljnje čiščenje.
FAQ
Zakaj na sploh moram vgraditi CSS za e-pošto?
Mnogi e-poštalnih klijentov — posebej Gmailov spletni vmesnik — odstrane <style> bloke iz <head> ali jih povsem ignora, toda oni spoštujejo style="" atribut na samem elementu. Vgrajevanje je rešitev, na kateri se opira cela industrija HTML-e-pošte.
Kaj se zgodi z medijskim poizvedbami in :hover pravili?
Ne morejo se vgraditi na en element, zato se po privzeto ohranijo v okrajšanem <style> bloku za klijente, ki ga berejo — izključite "Obdržati pravila, ki se ne morejo vgraditi" da jih namesto tega zavrzete.
Ali lahko pravilno rokovati specifičnost selektorjev?
Da. ID selektor premaga selektor razreda, ki premaga selektor tipa, ne glede na vrstni red, v katerem se pravila pojavljajo — enaka pravila, ki jih uporablja brskalnik. Izključite "Spoštovati specifičnost selektorjev" da se namesto tega spojite po vrstnem redu virov.
Za kaj so width/bgcolor atributi?
Nekatere starejše Outlook izdaje upodabljajo tabele z uporabo Word motorja in ignora inline CSS za ozadje in dimenzioniranje. "Dodati legacy width/bgcolor atribute" odraža te vrednosti na navadnih HTML atributih, ki jih ta klijenta spoštuje.
Ali je moj HTML uploadiran nekje?
Ne. CSS vgrajevanje se izvršava popolnoma v vašem brskalniku — vaša e-poštalnega šablona nikoli ne zapusti vašo napravo.