-
Üyelik
05.05.2017
-
Yaş/Cinsiyet
29 / E
-
Meslek
Web-Developer
-
Konum
İstanbul Avrupa
-
Ad Soyad
M** K**
-
Mesajlar
1025
-
Beğeniler
366 / 534
-
Ticaret
5, (%100)
Görsellere class / ID atayıp CSS ile mobilde farklı masaüstünde farklı yapabilirsiniz. Örneğin 1.görsel için class="birinci-resim" 2.görsel için class="ikinci-resim" ataması yapıp CSS dosyanıza:
.birinci-resim {
height: 300px!important;
}
.ikinci-resim {
height: 300px!important;
}
@media only screen and (max-width: 600px) {
.birinci-resim {
height: 300px!important;
}
.ikinci-resim {
height: 200px!important;
}
}
Böylece ikinci görseliniz masaüstünde 300px, mobilde 200 px olarak görünür. Bu arada yükseklik ve genişlik verirken px yerine % kullanmanızı tavsiye ederim. % değerler, sayfanın açıldığı cihazın ekranına göre otomatik boyutlanır. Örneğin resim için width: 100%; değeri verirseniz ben hangi cihazdan açarsam açayım o cihazın genişliği kadar görünür. Ama 300 px verirseniz ve ben 100px'lik alana sahip bir cihazdan açarsam görsel yine yarım görünür.
1 kişi bu mesajı beğendi.