Skocz do zawartości
PL
Szukaj na Pecetowiczu
  • Utwórz konto

Jak w CSS przeskalować obrazek aby się nie przesuwał przy przewijaniu


Rekomendowane odpowiedzi

Pytanie może banalne, niemniej wszelkie moje próby opanowania tematu zawiodły Jak "przeskalować" w css obrazek (800x1200) tła aby przy przewijaniu zawartości tekstowej div-a którego jest tłem, się nie przesuwał a cały obrazek był widoczny w określonym miejscu od góry div-a,  a nie wyśrodkowany, bo gubi się wtedy treść obrazka. Szerokość i wysokość samego div jest mniejsza od obrazka.

Odnośnik do komentarza
Udostępnij na innych stronach

Nadaj divowi z tłem background-size: cover w CSS

Odnośnik do komentarza
Udostępnij na innych stronach

(edytowane)

próbowałem -  bez oczekiwanego  rezultatu - tak to wygląda teraz a ma  być  pojedyncza górka na div  z <legend>.

Cały css na ten widok

Oczywiście to-to ma być też responsywne

<style type="text/css">.mount{background-image:url(/iNpfTkz.jpg);background-size:cover;background-attachment:fixed;background-size:487px 659px;color:#FFF;margin:0 auto;width:659px;max-width:100%;padding:15px 4px 10px}
legend{font:600 1.125em Helvetica,Verdana,sans-serif}</style>

Edytowane przez Bzy-Tek
Odnośnik do komentarza
Udostępnij na innych stronach

4 minuty temu, Bzy-Tek napisał:

próbowałem -  bez oczekiwanego  rezultatu

Okej, a może załączyłbyś podgląd kodu albo jakiś link, gdzie działasz?

Odnośnik do komentarza
Udostępnij na innych stronach

@Bzy-Tek A spróbuj tak:

.mount{
background-image:url(/iNpfTkz.jpg);
min-height: 500px; 
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
color:#FFF;
margin:0 auto;
width:659px;
max-width:100%;
padding:15px 4px 10px;
}

Przydało by się jakiś demko.

Odnośnik do komentarza
Udostępnij na innych stronach

(edytowane)

już  próbuję ☺️ .....

cały obrazek zrobił się wycentrowany,  powiększony i przycięty niestety

dla jasności  - całość tego tła siedzi w  div

.d{width:768px;max-width:100%;height:auto;background:url /+ obrazek tła ogólnej strony /...center center repeat-y;background-size:100%;margin:50px auto 57px;position:relative;font:1em Helvetica,Verdana,sans-serif;text-align:left;}

tutaj jest  _wszystko_  ok ale  jak wstawię to do div z kodem  powyżej to się  rozjeżdża

2 godziny temu, Mendelson. napisał:

Okej, a może załączyłbyś podgląd kodu albo jakiś link, gdzie działasz?

link do jsfiddle powyżej w  poście - z tym że tam jest wszystko ok a knoci się  po wstawieniu do jeszcze jednego div.

Poniżej - tak to wygląda w  szerszej  perspektywie. Na niebieskim tle po lewej zaczyna się powielać ten sam obrazek górki.Foto górki po prawej jest takie, jak powinno być.

wek01.jpg

Edytowane przez Bzy-Tek
obrazek
Odnośnik do komentarza
Udostępnij na innych stronach

Kontynuuj dyskusję

Dołącz do Pecetowicza, aby kontynuować dyskusję w tym wątku.

  • Dodaj nową pozycję...
  • Dodaj nową pozycję...