Html / CSS Kod Oluşturdum Mail CSS Desklemiyor Ne Yapılabilir?

31-05-2023, 15:48:19

#1

esimsek

Merhabalar ben html css kullanarak tablo çıktı formu oluşturdum fakat modül üzerinden maile düştüğünde tablo bozuk duruyor css desteklemiyor emailde gelen kutusunda düzgün bir şekilde kodların çalışması için ne yapabilirim?
Kod önizleyici editörde kodu çalıştırdığımda düzgün herhangi bir sorun görünmüyor lütfen yardımcı olurmusunuz? Kod içeriğini de buraya ekliyorum...
Kod Çıktı Resmi:

Bu altta verdiğim görüntü ise mail tarafına düşmüş hali ama bu şekilde olmasını istemiyorum yukarıda bulunan halde çıktı olarak görünmesini istiyorum css sorunu oluyor mail üzerine düştüğünde...

<!DOCTYPE html>
<html>
<head>
<title></title>

<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=PT+Sans&display=swap" rel="stylesheet">

<style type="text/css">

.arabatablo {
border-collapse: collapse;
font-family: 'PT Sans', sans-serif;
width:100%;
}

.arabatablo td, .arabatablo th {
border: 1px solid lavenderblush;
padding: 8px 12px;

}

.arabatablo th {

text-align: left;
background-color:tomato;
color:white;
}

.arabatablo tr:hover{
background-color: lavenderblush;
}

.arabatablo tr:nth-child(even){
background-color:floralwhite;
}

</style>
</head>
<body>

<table class="arabatablo">
<tr>
<th colspan="4"><center>Başvuru Pozisyonu</center></th>
</tr>
<tr>
<td>Başvuru Türü:</td>
<td>{element|id:4|Başvuru Türü}</td>

</tr>

<tr>
<td>Başvurulan Pozisyon:</td>
<td>{element|id:5|Başvurulan Pozisyon}</td>

</tr>
<tr>
<td>Ücret Beklentisi:</td>
<td>{element|id:18|Ücret Beklentiniz}</td>

</tr>

<tr>
<td>KVKK Bildirimi:</td>
<td>Başvuruda bulunan {element|id:22|Adınız } KVKK bildirimini okuyup onaylamıştır.</td>

</tr>
<tr>
<th colspan="4"><center>Kişisel Bilgiler</center></th>
</tr>
<tr>
<td>Ad Soyad: {element|id:22|Adınız }</td>
<td>Askerlik Durumunuz: {element|id:43|Askerlik Durumunuz}</td>

</tr>

<tr>
<td>Doğum Tarihi: {element|id:24|Doğum Tarihiniz}</td>
<td>Terhis Tarihi ve Yeri: {element|id:56|Terhis Tarihi ve Yeri}</td>

</tr>
<tr>
<td>Doğum Yeri: {element|id:28|Doğum Yeriniz}</td>
<td>Ehliyet: {element|id:47|Ehliyetiniz}</td>

</tr>

<tr>
<td>Cinsiyet: {element|id:32|Cinsiyetiniz}</td>
<td>Medeni Durumu: {element|id:48|Medeni Durumunuz}</td>

</tr>
<tr>
<td>Ev Telefonu: {element|id:33|Ev Telefonunuz}</td>
<td>Uyruğu: {element|id:49|Uyruğunuz}</td>

</tr>
<tr>
<td>Cep Telefonu: {element|id:37|Cep Telefonunuz}</td>
<td>Uyruk Diğer: {element|id:52|Diğer}</td>

</tr>

<tr>
<td>E-Posta Adresi: {element|id:38|E-Posta Adresiniz}</td>
<td>Mezuniyet: {element|id:57|Mezuniyetiniz}</td>

</tr>
<tr>
<td>Adres Bilgisi: {element|id:39|Adresiniz}</td>
<td>Yabancı Dil: {element|id:356|Yabancı Dil}</td>

</tr>
<tr>
<th colspan="4"><center>Kişisel Durum</center></th>
</tr>
<tr>
<td>Bedensel Engeli: {element|id:325|Bedensel Engeliniz Var mı?}</td>
<td>Boy: {element|id:340|Boyunuz}</td>

</tr>

<tr>
<td>Bedensel Engeli Var İse: {element|id:326|Bedensel Engeliniz}</td>
<td>Kilo: {element|id:341|Kilonuz}</td>

</tr>
<tr>
<td>Ameliyat Oldunuz mu?: {element|id:329|Ameliyat Oldunuz mu?}</td>
<td>Sabıka Kaydı: {element|id:345|Sabıka Kaydınız Var mı?}</td>

</tr>

<tr>
<td>Ameliyat Olmuş İse: {element|id:331|Ameliyat}</td>
<td>Sigara Kullanıyormu?: {element|id:346|Sigara Kullanıyor musunuz?}</td>

</tr>
<tr>
<td>Hastalığınız Var mı?: {element|id:334|Hastalığınız Var mı?}</td>
<td>Bir Kuruma Borcu Var Mı?: {element|id:348|Bir kuruma borcunuz varmı?}</td>

</tr>

<tr>
<td>Hastalığı Var İse: {element|id:336|Hastalığınız}</td>
<td>Emekli Olduğu Kuruluş Var İse: {element|id:352|Emekli Olunan Kuruluş}</td>
<tr>
<tr>
<th colspan="4"><center>Öğrenim Bilgileri</center></th>
</tr>
<tr>
<td>İlköğretim:</td>
<td>Okul: {element|id:104|} Bölüm: {element|id:105|} Derece: {element|id:107|} Başlama Tarihi: {element|id:109|} Bitiş Tarihi: {element|id:111|}</td>

</tr>

<tr>
<td>Lise:</td>
<td>Okul: {element|id:160|} Bölüm: {element|id:162|} Derece: {element|id:164|} Başlama Tarihi: {element|id:166|} Bitiş Tarihi: {element|id:168|}</td>

</tr>
<tr>
<td>Üniversite1:</td>
<td>Okul: {element|id:149|} Bölüm: {element|id:151|} Derece: {element|id:153|} Başlama Tarihi: {element|id:155|} Bitiş Tarihi: {element|id:157|}</td>

</tr>

<tr>
<td>Üniversite2:</td>
<td>Okul: {element|id:138|} Bölüm: {element|id:140|} Derece: {element|id:142|} Başlama Tarihi: {element|id:144|} Bitiş Tarihi: {element|id:146|}</td>

</tr>
<tr>
<td>Yüksek Lisans:</td>
<td>Okul: {element|id:127|} Bölüm: {element|id:129|} Derece: {element|id:131|} Başlama Tarihi: {element|id:133|} Bitiş Tarihi: {element|id:135|}</td>

</tr>

<tr>
<td>Yüksek Okul:</td>
<td>Okul: {element|id:116|} Bölüm: {element|id:118|} Derece: {element|id:120|} Başlama Tarihi: {element|id:122|} Bitiş Tarihi: {element|id:124|}</td>
<tr>

<th colspan="4"><center>İş Deneyimi</center></th>
</tr>
<tr>
<td colspan="4">Şirket: {element|id:260|} Departman: {element|id:261|} Pozisyon: {element|id:262|} Giriş Tarihi: {element|id:264|} Çıkış Tarihi: {element|id:266|} Görevi: {element|id:268|}</td>

</tr>

<tr>
<td colspan="4">Şirket: {element|id:284|} Departman: {element|id:286|} Pozisyon: {element|id:288|} Giriş Tarihi: {element|id:290|} Çıkış Tarihi: {element|id:292|} Görevi: {element|id:294|}</td>

</tr>
<tr>
<td colspan="4">Şirket: {element|id:271|} Departman: {element|id:273|} Pozisyon: {element|id:275|} Giriş Tarihi: {element|id:277|} Çıkış Tarihi: {element|id:279|} Görevi: {element|id:281|}</td>

</tr>
<tr>
<th colspan="4"><center>Referanslar</center></th>
</tr>
<tr>
<td>Adı Soyadı: {element|id:297|} İş Yeri: {element|id:299|} Pozisyon: {element|id:301|} Telefon: {element|id:303|}</td>
<td>Adı Soyadı: {element|id:311|} İş Yeri: {element|id:313|} Pozisyon: {element|id:315|} Telefon: {element|id:317|}</td>
</tr>
<td style="height: px;" colspan="4"><center><footer>© Copyright 2023 Ravanda Carpet. All rights reserved</footer></center></td>
</table>

</body>
</html>
31-05-2023, 16:17:13

#2

Ribbon

Hocam anladığım kadarıyla yorumluyorum dediğiniz şey mümkün değil mailinize css ve html kodlarını gönderemezsiniz çok basit bir admin paneli tasarlayıp biraz php kodlarıyla aynı bu tabloyu önünüze düşürebilirsiniz
31-05-2023, 16:20:58

#3

esimsek

Html kod göndermiyorum ben konuyu size şöyle özetleyeyim wordpress tabanlı bir web sitem var orada iş başvuru formu design ettim qform modülü aracılığı ile orada ise formun çıktı hali için bir tablo tasarladım yani başvuruda bulunan kişinin bilgileri bu tablo içerisinde otomatik çekicek ve maile düzenli bir tablo içerisinde düşmüş olucak fakat css kodları da kullandığımdan dolayı mailde gelen kutusuna baktığımızda çıktı çok kötü duruyor bu da css çalıştıramadığından dolayı bozuk çıkmasına sebebiyet veriyor...

Ribbon adlı üyeden alıntı: mesajı görüntüle

Hocam anladığım kadarıyla yorumluyorum dediğiniz şey mümkün değil mailinize css ve html kodlarını gönderemezsiniz çok basit bir admin paneli tasarlayıp biraz php kodlarıyla aynı bu tabloyu önünüze düşürebilirsiniz
07-06-2023, 22:35:47

#4

polathinyo
@esimsek; Maillerde css desteklemesi için inline css kullanmanız gerekir. Head alanına eklediğiniz css'ler çalışmaz. Css'leri direk html tag'lerinize inline olarak verin, sorun çözülecektir.

Örnek;
```
yazı büyüsün.
```