WhatsApp
Telefon

Mobil Sitede veya Bilgisayarda div Gizleme Nasıl Yapılır.

Yazılarımız ve Makalelerimiz.

Anasayfa Blog Blog Mobil Sitede veya Bilgisayarda div Gizleme Nasıl Yapılır.
24 Ocak 2020, 02:06 0 Yorum 106 Okuma

Bootstrap hakkında  çok basit ve kısa bir bilgiyi bu yazımda  aktarmak istiyorum. Mobil cihazların durumu ortada ve bazen  web sitelerini hızlı açmakta oldukça zorlanıyor. Biz web geliştiricileri ise bu durumu minimuma indirmek amacıyla  bazı elementleri mobil sürüme  kapatıyoruz. Bu arada bu class’ları sadece divlere  değil, herhangi bir elemente de uygulayabilir siniz.. Aşağıdaki class’lar mobilde divleri gizlemenize veya bazı divleri sadece mobilde göstermenizi sağlayacaktır.

hidden-xs” class’ını kullanarak istediğimiz divi mobilde gizleyebiliriz.

visible-xs-block” class’ını kullanarak, istediğimiz bir divi sadece mobil cihazlara gösterebiliriz.

 

Elinizde bir reklam kodu veya mobil kullanıcılarınız telefonlarında açamayacağı büyüklükte resim, video gibi akıllı telefonları yoran kodları gizlemek istiyorsanız aslında çok basit bir kodumuz mevcut. Bir kaç css kodu ile çok bilginiz olmasa daha yapabileceğiniz bu işlem şöyle yapılıyor. Örneğin elimizde reklam kodu var bunu sadece masaüstü kullanıcılarına göstermek istiyoruz. (Not : Bunun tam tersi de mevcut yani sadece mobil kullanıcılarınızın div etiketini görmesi içinde yapabilirsiniz. )

 


@media screen and (max-width: 600px) {
.nomobile {
visibility: hidden;
clear: both;
float: right;
margin: 5px auto;
width: 22%;
height: auto;
display: none; // Önemli olan nokta burası burayı kaldırırsanız sadece mobile için görüntülenir.
}
}


Buradaki en önemli nokta display:none; kodu olup mobil ekranda çıkmasını istiyorsanız bu etiketi kaldırmanız yeterlidir.

Mobil Kullanıcılardan div etiketini gizlemek
Mobil Kullanıcılardan div etiketini gizlemek
daha sayfanızda gizlemek istediğiniz bölümü

Mobil Kullanıcılardan div etiketini gizle

Burada illa div tagında kullanma zorunluluğu yoktur.

 

etiketleri arasına bile alabilirsiniz.
Aklınıza takılan bir yer varsa konuda belirtmeniz yeterli olacaktır.

Okuyucu Yorumları

0 Yorum