Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
[CSS] Rozciąganie tła
#1
Witajcie,

Otóż mam taki problem, że tło rozciąga mi się poza ekran (tak jak ekran były dużo większy niż jest) gdy dodam więcej tekstu na stronę. Chciałbym, żeby tło było stałe i zawsze dopasowane do wielkości ekranu Poniżej daję kod html i css.

Pozdrawiam, Przemek.

CSS:
Kod:
html {
background: url(images/Bottom_texture.jpg) no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}
body {

width: 80%;
margin-left:auto;
margin-right:auto;
padding: 0;
}
#logo {
position:relative; left: 50px;
}
#tresc{
clear: both;
}
#main-content {
width: 75%;
float: right;
}
#left-menu{
width: 25%;
float: left;
list-style: none;
margin: 0;
padding: 0;
}
ul {
list-style: none;
}
li {

margin-bottom: 2px;
margin-left: 8px;
}

#textmain{
background: url(images/menu-bg2.png) no-repeat;
width: 180px;
height: 30px;
padding: 5px;
text-align: center;
}
#tagline{
clear: both;

}
a:link {color: #F0FFF0}
a:hover {color: #D3D3D3}
a:visited {color: #F0FFF0}
body,th,td {
font-family: Century Gothic, Arial, Helvetica, Sans-Serif;
font-size: 12px;
color: #000000;
}
#footer {
text-align: center;
color: #F0FFF0;
}

HTML:
Kod:
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

<head>
        <link rel="stylesheet" type="text/css" href="style-h.css" />
    <title>TestowaBies</title>
</head>

<body >

<div id="logo">
<img src="images/header-object.png" alt="Pociagi" />
</div>


<div id="main-content">


  <h1> Witamy! </h1> <br/>
<div id="tresc">
<center>
<p>Przy budowie Kolei Transsyberyjskiej bylo zatrudnionych okolo 90 tysiecy ludzi. Calkowity koszt budowy ponioslo
panstwo rosyjskie. Budowy przebiegaly przez tereny prawie calkowicie bezludne i niezamieszkale. Gestosc
zaludnienia na terenach budowy wynosila wówczas 1,2 czlowieka na km². Ludnosc stanowili w wiekszosci
mieszkancy tajgi i chlopi.</p>

<p>Zatrudnieni przy pracach budowlanych ludzie mieszkali, a w zasadzie koczowali wzdluz budowanych sukcesywnie
torów kolejowych w specjalnie wybudowanych drewnianych barakach lub namiotach. W ten sposób powstawaly
wzdluz trasy niewielkie obozy i osiedla, a nastepnie niewielkie osady, które z czasem przeksztalcaly sie w wieksze
miasta i miasteczka.</p>
<p>Do pracy zatrudniano zarówno fachowców jak i zwyklych pomocników, a takze zeslanców i skazanych. Wiezienia w
Rosji pozwalnialy sie, a wiezniowie byli motywowani do pracy skracaniem kary. Liczni wiezniowie byli zmuszani do
pracy niemalze niewolniczej, az do skrajnego wyczerpania</p>
<p id="1">Rosyjska polityka przesiedlencza ukoronowana zostala sukcesem. W latach 1900-1910 na Syberie, do tutejszych
prowincji, przeprowadzilo sie mniej lub bardziej dobrowolnie okolo 3 miliony obywateli Rosji,
przede wszystkim chlopów.</p>

<p>Na terenach budowy wybuchaly czesto epidemie, w zwiazku z czym wielu pracowników zmarlo. Roboty utrudnialy latem
uciazliwe insekty, przed którymi nalezalo chronic twarz specjalnymi przezroczystymi maskami.</p>

<p>Na zalesionych odcinkach Wschodniej Syberii zdobycie i transport drewna nie stanowily problemu.
Natomiast na obszarze stepów zachodnio-syberyjskich nalezalo je najpierw dowiezc z terenów zalesionych.
Podobnie piasek na waly kolejowe musial byc czesto transportowany z odleglych terenów. Wawozy musialy zostac
utwardzone i wzmocnione. </p>

<p>Od samego poczatku trasa Kolei Transsyberyjskiej byla dobrze chroniona i strzezona. Co jakis czas budowano wzdluz
torów domy straznicze i punkty kontrolne.</p>

<p>Jednym z wiekszym wyzwan byla budowa mostów na rzekach. Poczatkowo male mosty na mniejszych rzekach budowano
wylacznie z drewna. Mosty stalowe powstawaly wylacznie na duzych rzekach. Gigantycznych rozmiarów mosty na
wielkich rzekach syberyjskich uznawane byly wówczas za szczyt osiagniec technicznych. Konstruktor
mostu na rzece Jenisej niedaleko Krasnojarska(Leonid Proskurjakow) zdobyl swiatowe uznanie i wygral
(podobnie jak i konstruktorzy Wiezy Eifla w Paryzu) zloty
medal na wystawie swiatowej w Paryzu.</p>

<p>Jednoczesnie budowano tez mniejsze i wieksze dworce kolejowe, z których wiekszosc wygladala bardzo podobnie.</p>

<p>Najbardziej kosztowna i uciazliwa w calej historii budowy Kolei Transsyberyjskiej byla budowa odcinka
pomiedzy miejscowosciami Port Bajkal i Kultuk. Na jeden kilometr zuzyto tone materialów wybuchowych w celu
umozliwienia przeprowadzenia torów przez skalisty brzeg Jeziora Bajkal. Wybudowano lacznie 39 tuneli
o lacznej dlugosci ponad 6 km. Do budowy tuneli sciagnieto fachowców  
z Wloszech.</p>

<p>Od samego poczatku na wybudowanych trasach Kolei Transsyberyjskiej mozna bylo spotkac licznych turystów zagranicznych.
Pocztówki byly dostepne nie tylko z napisami cyrylica, ale równiez w jezykach obcych, przede wszystkim w jezyku
francuskim.</p>

<p>Pomimo wielkosci i starannosci przedsiewziecia budowy Kolei Transsyberyjskiej zdarzaly sie wypadki powodowane
zazwyczaj ekstremalnymi warunkami podczas prac budowlanych, szybkim tempem budowy i problemami finansowymi,
przez co jakosc ulegala pogorszeniu. W poczatkowych latach kursowania pociagów katastrofy kolejowe byly
stosunkowo czeste. Pózniej zaczeto wzmacniac waly, wymieniac podklady i zastepowac drewniane mosty na mniejszych
rzekach mostami stalowymi.</p>
</center>

</div>
</div>

  <div id="left-menu">
  
   <ul>
   <div id="menubg" width="180px"  height="37px" >
    <p id="textmain">Main Menu</p>
    </div>
    <li><a href="index.html">Strona Glówna</a></li>
    <li><a href="history.html">Historia</a></li>
    <li><a href="road.html">Trasa</a></li>
    <li><a href="gallery.html">Galeria</a></li>
    <li><a href="kontakt.html">Kontakt</a></li>
    </ul>
    
</div>

<div class="bottom" id="tagline">
<br/>
<br/>
<br/>

<div id="footer">
Copyrights &copy; 2012
</div>
</div>

</body>
</html>
Odpowiedz
#2
http://css-tricks.com/perfect-full-page-background-image/

Kod:
html {
    background: url(images/Bottom_texture.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
Odpowiedz
#3
Pod tym linkiem od Heyek są też inne możliwości rozwiązania problemu.
"Badz czlowiekiem laskawym tak,
i od czasu do czasu wcisnij prawy alt."
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
  rozciaganie obrazka tarjeta.tarjeta 4 3,055 01-12-2010, 07:16
Ostatni post: ixtab

Skocz do:


Użytkownicy przeglądający ten wątek:
Sponsorzy i przyjaciele
SeoHost.pl