Neler yeni

Yeni mesajlar Yeni konular En çok mesaj En çok tepki En çok görüntülenen

HTML Çözünürlük Sorusu

Burst_AnqeL_

🌱Yeni Üye🌱
Katılım
2 Nis 2009
Mesajlar
5
Tepkime puanı
0
Merhaba, çok basit bir şekilde oluşturmaya çalıştığım sayfalar var. Tek bir sorunum var o da çizdiğim sayfaların istediğim bir şekilde sayfada durmaması. Örneğin çizdiğim bir 1920x1500 px'lik resmin <center>..</center> kodlarıyla 1024x768 px'lik çözünürlükte sadece sol üst köşesinin gözükeceğini biliyorsunuz. İstediğim şey bu 1920x1500 px'lik resimin herhangi bir boyutta değişme olmadan orta kısımdan başlayarak yatay olarak 1024 px'lik kısmının gözükmesi. Yanda bulunan kaydırma çubuğu ile 1500 px'lik yükseklik gözükebilir fakat yan kısımların çözünürlüğe bağlı olarak gömülmesi gerek.

Örn : Aşağıdaki resimde tarayıcıda resmin nasıl cıkması gerektiğini anlattım. Kısacası çözünürlüğe göre değişmeyecek ve orta kısımdan itibaren full hd çözünürlük olana kadar resmin belirli bi kısmını gösterecek şekilde nasıl yapabilirim ? Yardımlarınız için şimdiden teşekkürler.

[
 

futurist

⭐Deneyimli Tasarımcı⭐
Katılım
20 Ara 2012
Mesajlar
179
Tepkime puanı
0
resmin üstüne yazı yazmayacaksan süper çözümüm var hatta her monitörde hatta tablette dahil bütün resmi otomatik büyütüyor. fakat resimin boyutundan daha büyük bir monitörde resim biraz yayılma olabilir ki senin resmin 1920 olduğuna göre daha büyük monitör sorunun çok olmayacaktır. 2550px monitörlerde var ama kullanıcısı şuan az olduğundan çok önemli değil.

herneyse çözüme gelince
<div id="anasayfa"><img src="buraya resmini koyuyorsun" width="100%" height="100%"/></div>

anasayfa yı tam ekran yapacağın için büyük ekrana göre ayarlama yap. ekran küçüldükçe ayarlanacaktır css şöyle:
height:1000px;
width:100%;

illa üstüne birşeyler yazacağım diyorsan üstüne oluşturduğun div absolute olmalı. ama şimdiden uyarıyım absolute olunca kontrol etmesi zor kaymalar olabilir şahsen ben başemedim en iyisi yazı yazacaksan resimin altına yaz derim başın ağrımaz.

ama yok ben background olarak yapayım üstüne yazı çizi olacak diyorsan
kod şöyle:


background-image: url(../ar%C5%9Fiv/hd%20foto%C4%9Fraflarsuperbbeachwallpaper3179_1920x1080.jpg);
background-repeat: no-repeat;
background-position: center center;
display: block;
background-position-x: 50%;
background-position-y: 0px;
background-size: cover;---------------önemli
background-repeat-x: no-repeat;
background-repeat-y: no-repeat;
background-origin: initial;
background-clip: initial;
height:1000px;
width:100%;--------------------önemli
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
-webkit-background-size: cover;-------------bu üçü önemli her tarayıcıda çalışması için
-moz-background-size: cover;
-o-background-size: cover;
background-attachment:fixed;
overflow:hidden hidden;
position: relative;
min-height:100%;
min-width:100%;
max-width:100%;
max-height:100%

bunu yap tamamdır. yardım edeyim. ama kesin olur
 
Üst