Bilgisayar ve Mobil için Farklı Reklam

Merhaba arkadaşlar,
Sitemde mobil kullanan kullanıcılara ayrı, bilgisayar kullanan kullanıcılara ayrı reklam göstermek istiyorum.
Örneğin header kısmında mobil kullanıcılara 300x250, bilgisayardan girenlere 728x90 boyutlarında reklam göstermek istiyorum.

Bunu nasıl yapabilirim?

Merhaba hocam,

CSS kodlarının desteğiyle yapabilirsiniz diye düşünüyorum.

MOBİLE GÖRÜNECEK İÇERİK İÇİN HTML;

<div class="mobilegoster">
İçeriğiniz Buraya
</div>

MOBİLE GÖRÜNECEK İÇERİK İÇİN CSS;

<style type="text/css">
.mobilegoster {display: none;}

/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){
.mobileShow {display: inline;}
}
</style>

MASAÜSTÜNE GÖRÜNEN İÇERİĞİ MOBİLDE GİZLEMEK İÇİN HTML;

<div class="mobilegizle"> Masaüstü İçeriğiniz buraya </div>

MASAÜSTÜNE GÖRÜNEN İÇERİĞİ MOBİLDE GİZLEMEK İÇİN CSS;

<style type="text/css">
  .mobilegizle { display: inline; } 

  /* Smartphone Portrait and Landscape */ 
  @media only screen 
    and (min-device-width : 320px) 
    and (max-device-width : 480px){ 
     .mobileHide { display: none;}
  }
</style>

Mobile görünen içerik CSS'de sadece max 480px genişliğindeki cihazlarda görüneceği için masaüstü versiyonunda görünmeyecektir.



Hocam MASAÜSTÜNE GÖRÜNEN İÇERİĞİ MOBİLDE GİZLEMEK İÇİN CSS'de bir hata yapmışım düzelteyim o kodu;

<style type="text/css">
  .mobilegizle { display: inline; } 

  /* Smartphone Portrait and Landscape */
  @media only screen
    and (min-device-width : 320px) 
    and (max-device-width : 480px){ 
     .mobilegizle { display: none;}
  }
</style>