pc menü mobil menü

13-11-2017, 01:13:01

pc için farklı mobil için farklı menü kullanıyorum farkat ben bunda logo ayarlayamıyorum bir çok yerde menü yanında olan logo pc de farklı mobilde farklı oluyor arastırdım ama nasıl olduğunu bulamadım yardım edermisiniz

bide boostrap kullanıyorum ben bunda colanların arka planlarını nasıl değiştirebilirim?

13-11-2017, 01:38:44

#2

Ofisimo

Bootstrap 3 kullanıyorsan Ikı tane logo alanı yaparsın pcde ve mobilde div clasına hidden-xs ve hidden-sm ile birbirinde gizlersin
.hidden-xs Öğeyi sadece 768px altı ekran genişliklerinde gizler.
.hidden-sm Öğeyi sadece 768px ile 992px arasındaki ekran genişliklerinde gizler.
.hidden-md Öğeyi sadece 992px ile 1200px arasındaki ekran genişliklerinde gizler.
.hidden-lg Öğeyi sadece 1200px üstü ekran genişliklerinde gizler.

13-11-2017, 01:45:15

#3

mehmet0715

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

Ikı tane logo alanı yaparsın pcde görünen logoyu mobilde gizlemek için div clasına hidden-xs koyarsan mobilde görünmez.
Mobil logoyuda pcde gizlemek için css dosyasında aşağıdakı kodunu uygulayabilirsin.
@media screen and (min-width:500px) ,screen and (max-device-width:1200px) { .mobillogo{display:none;} }

özelden pm ile size siteyi göstersem bu logo alanı hakkında düşüncelerinizi alsam olur mu css de yeni başladım ve bilgili olan bütün herkesin fikrini almak istiyorum

13-11-2017, 01:49:49

#4

Ofisimo

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

özelden pm ile size siteyi göstersem bu logo alanı hakkında düşüncelerinizi alsam olur mu css de yeni başladım ve bilgili olan bütün herkesin fikrini almak istiyorum

mesajımı editledim Bootstrap 3 kullanıyorsanız hidden- kodlarıyla gizleme işlemlerini daha rahat yaparsınız.

13-11-2017, 01:54:29

#5

mehmet0715

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

mesajımı editledim Bootstrap 3 kullanıyorsanız hidden- kodlarıyla gizleme işlemlerini daha rahat yaparsınız.

bir deniyeyim teşekkürler

13-11-2017, 13:19:02

#6

D62

@media screen and (max-width: 1024px) { .logo { background-image: url("img/logo.png") !important; }}
@media screen and (max-width: 960px) { .logo { background-image: url("img/mobil-logo.png") !important; }}
@media screen and (max-width: 768px) { .logo { background-image: url("img/mobil-logo.png") !important; }}
@media screen and (max-width: 640px) {.... }
@media screen and (max-width: 480px) {.... }

Media screen sorguları ile bu istediğini yapabilirsin.
daha fazla detay için googlede css media screen sorguları hakkında fikir alabilirsin.
Yukarıda ki kodlar işini çözecektir.
her ekranda farklı logo gösterir.
logonun genişlik ve yükseklik değerlerini unutma

kolay gelsin

13-11-2017, 18:20:53

#7

mehmet0715

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

@media screen and (max-width: 1024px) { .logo { background-image: url("img/logo.png") !important; }} @media screen and (max-width: 960px) { .logo { background-image: url("img/mobil-logo.png") !important; }} @media screen and (max-width: 768px) { .logo { background-image: url("img/mobil-logo.png") !important; }} @media screen and (max-width: 640px) {.... } @media screen and (max-width: 480px) {.... }
Media screen sorguları ile bu istediğini yapabilirsin.
daha fazla detay için googlede css media screen sorguları hakkında fikir alabilirsin.
Yukarıda ki kodlar işini çözecektir.
her ekranda farklı logo gösterir.
logonun genişlik ve yükseklik değerlerini unutma

kolay gelsin

teşekürler şuan logo hallettim arkaplan ile uğraşıyorum

14-11-2017, 01:13:34

#8

D62

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

teşekürler şuan logo hallettim arkaplan ile uğraşıyorum

Önemli degil kolay gelsin