[REZOLVAT]background pe tot ecranul

3 participanți

:: Specialisti suport :: Probleme legate de aspect

[REZOLVAT]background pe tot ecranulDum Iun 16, 2013 10:06 am

salut am i imagine de 1440x745px si vreau sa o pun ca fundal la un index numai ca am o problema.nu apare nici macar la 800px latime desi ea este de 1440px

deci in final cum o pot pune pe jumatate si sa fie cat ecranul sau la marimea dorita ca latime?

imaginea https://i.servimg.com/u/f80/14/12/03/12/fundal10.png

acesta este codul css folosit de mine
ma puteti ajuta si cu cod java scrip daca este nevoie

ma scuzati trebuia sa postez in sectiunea de templateuri (am reeditat abia dupa ce am vazut)
deci problema mea este la un template (sablon sau index ) pe intelesul tuturor

Cod:



body{
background-image: url(;http://i80.servimg.com/u/f80/14/12/03/12/fundal10.png;);
height: 781px;
width: 100%;
top: 10px;
background-repeat: no-repeat;
background-position: center center;
position: absolute;
background-color: black;
}

Re: [REZOLVAT]background pe tot ecranulDum Iun 16, 2013 10:26 am

Salutare,
Cred ca ar trebui sa cercetezi mai intai sursa/host-ul pe care ai urcat imaginea. S-ar putea ca de acolo sa fie problema. Wink

Mai exact, fi atent ca nu cumva la upload sa-ti modifice marimea imaginii.(trebuie ca optiunea "Redimensioneaza imaginea? " sa fie setata pe nu)

Re: [REZOLVAT]background pe tot ecranulDum Iun 16, 2013 12:49 pm

uite index-ul ca sa ezi exact despre ce vorbesc,nu ma pricep de multe ori sa explic
cod-ul de background l-am copiat de pe un site...

Cod:



<html>
<center>

<div class="header" height="250px"><div class="titlu">fraNNNta-Design.Online-Talk.NeT<br><br><br>

</div>

<div class="adaugare" align="bottom" width="90%">
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
</div>

</div>
<div class="centru">

<table width="100%" cellspacing="0" border="1">
<tr>
<th>Nume Server</th>
<th> IP Server</th>
<th> Status</th>
<th> Sloturi</th>
<th> Fondator</th>
<th> Host</th>
</tr>
<tr>
<td>Magiee.Ro</td>
<td>192.168.1.1</td>
<td>mereu online</td>
<td>32 playeri</td>
<td>ssg fbi</td>
<td>GamesZone</td>
</tr>


<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>




<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>





<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>


<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>




<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>



<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>



<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>



<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>
<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>


<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>

<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>

<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>


<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>





</table>


</div>
<div class="footer"><img src="images/footer.png" width="950px" height="400px">




<div class="video" align="center">Bine a-ti venit in footer-ul nostru aici o sa descoperiti ceva simplu si frumos si cam atat deocamdata ca m-am plictisit sa scriu =)) si dupa cum v-am spus este simplu</div>


</div>
</div>

</center>

</html>


<style>








.header{
background: url(http://www.nexen.org/uploads/images/2012/mar/52/484_fr_banner_nexen_revolt.jpg);
border: 1px solid #474747;
border-bottom: none;
background-color: #fff;
height: 250px!important;
width: 950px!important;}


.centru{
padding-bottom: 1px;
padding-top: 1px;
border: 1px solid #474747;
border-bottom: none;
background-color: #f5f5f5;
min-height: 200px!important;
width: 950px!important;}


.footer{
background: white;
border: 1px solid #474747;
border-top:  none;
position: relative;
bottom: 73px;
height: 300px!important;
width: 950px!important;}


.video{

float: left;
text-align: left;
color: white;
text-shadow: 0px 0px 15px black;
font-size: 16px;
width: 920px;
height: 200px;
position: relative;
left: 10px;
bottom: 400px;
}


td,th{
text-align: center}

td,th{
height: 35px;
background: #e8e8e8; /* Old browsers */
background: -moz-linear-gradient(top,  #e8e8e8 0%, #ffffff 46%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(46%,#ffffff), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
border: 1px solid white;
box-shadow: 0px 0px 1px black;
color: black;

}

table{
position: relative;
bottom: 71px;
}


.titlu{
position: relative;
top: 20px;
right: 300px;
font-size: 20px;
color: green;
text-shadow: 0px 0px 25px white;}






.adaugare a{
color: black;
text-decoration: none;
font-size: 14px;
font-family: arial;
border: 1px solid #474747;
float: right;
position: relative;
bottom: 101px;
right: 3px;
margin-left: 5px;
padding: 5px 20px 5px 20px;
background: #e8e8e8; /* Old browsers */
background: -moz-linear-gradient(top,  #e8e8e8 0%, #ffffff 46%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(46%,#ffffff), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
border: 1px solid white;
box-shadow: 0px 0px 1px black;
color: black;
border-radius: 5px 5px 0px 0px;
}





.header p{
position: relative;
bottom: 150px;}

</style>



body{
background-image: url('http://www.psimg.com/images/design/watermark.jpg');
height: 781px;
width: 100%;
top: 120px;
background-repeat: no-repeat;
background-position: center center;
position: absolute;
}

Re: [REZOLVAT]background pe tot ecranulDum Iun 16, 2013 12:56 pm

Hmm, nu stiu exact ce sfat sa-ti dau fiinca nu prea ma pricep in domeniu foarte mult, dar ai incercat sa reincarci tu imaginea respectiva pe un site de upload? Sau nu stiu dupa cate vad imaginea este la o dimensiune mica.. incearca sa o faci mai mare si spune-ne daca ai rezolvat ceva. Very Happy

Re: [REZOLVAT]background pe tot ecranulDum Iun 16, 2013 1:18 pm

am inlocuit imaginea cu link-ul de la servimg.com hostul forumului.
trebuie sa pun sursa imaginii in forum si nu stiu cum Sad

Re: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 5:45 am

Ok, deci. Codul oferit de tine se va afisa corect in varianta asta:

Cod:


<html>
<center>

<div class="header" height="250px"><div class="titlu">fraNNNta-Design.Online-Talk.NeT<br><br><br>

</div>

<div class="adaugare" align="bottom" width="90%">
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
</div>

</div>
<div class="centru">

<table width="100%" cellspacing="0" border="1">
<tr>
<th>Nume Server</th>
<th> IP Server</th>
<th> Status</th>
<th> Sloturi</th>
<th> Fondator</th>
<th> Host</th>
</tr>
<tr>
<td>Magiee.Ro</td>
<td>192.168.1.1</td>
<td>mereu online</td>
<td>32 playeri</td>
<td>ssg fbi</td>
<td>GamesZone</td>
</tr>


<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>




<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>





<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>


<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>




<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>



<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>



<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>



<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>
<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>


<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>

<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>

<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>


<tr>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
<td>liber</td>
</tr>





</table>


</div>
<div class="footer"><img src="images/footer.png" width="950px" height="400px">




<div class="video" align="center">Bine a-ti venit in footer-ul nostru aici o sa descoperiti ceva simplu si frumos si cam atat deocamdata ca m-am plictisit sa scriu =)) si dupa cum v-am spus este simplu</div>


</div>
</div>

</center>

</html>


<style>








.header{
background: url(http://www.nexen.org/uploads/images/2012/mar/52/484_fr_banner_nexen_revolt.jpg);
border: 1px solid #474747;
border-bottom: none;
background-color: #fff;
height: 250px!important;
width: 950px!important;}


.centru{
padding-bottom: 1px;
padding-top: 1px;
border: 1px solid #474747;
border-bottom: none;
background-color: #f5f5f5;
min-height: 200px!important;
width: 950px!important;}


.footer{
background: white;
border: 1px solid #474747;
border-top:  none;
position: relative;
bottom: 73px;
height: 300px!important;
width: 950px!important;}


.video{

float: left;
text-align: left;
color: white;
text-shadow: 0px 0px 15px black;
font-size: 16px;
width: 920px;
height: 200px;
position: relative;
left: 10px;
bottom: 400px;
}


td,th{
text-align: center}

td,th{
height: 35px;
background: #e8e8e8; /* Old browsers */
background: -moz-linear-gradient(top,  #e8e8e8 0%, #ffffff 46%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(46%,#ffffff), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
border: 1px solid white;
box-shadow: 0px 0px 1px black;
color: black;

}

table{
position: relative;
bottom: 71px;
}


.titlu{
position: relative;
top: 20px;
right: 300px;
font-size: 20px;
color: green;
text-shadow: 0px 0px 25px white;}






.adaugare a{
color: black;
text-decoration: none;
font-size: 14px;
font-family: arial;
border: 1px solid #474747;
float: right;
position: relative;
bottom: 101px;
right: 3px;
margin-left: 5px;
padding: 5px 20px 5px 20px;
background: #e8e8e8; /* Old browsers */
background: -moz-linear-gradient(top,  #e8e8e8 0%, #ffffff 46%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(46%,#ffffff), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e8e8e8 0%,#ffffff 46%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
border: 1px solid white;
box-shadow: 0px 0px 1px black;
color: black;
border-radius: 5px 5px 0px 0px;
}





.header p{
position: relative;
bottom: 150px;}
body{
background-image: url('http://www.psimg.com/images/design/watermark.jpg');
height: 781px;
width: 100%;
top: 120px;
background-repeat: no-repeat;
background-position: center center;
position: absolute;
}
</style>

In ceea ce priveste imaginea din primul tau mesaj, ti-am spus. Mai mult ca sigur se datoreaza upload-ului. Wink

Re: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 5:47 am

te rog sa reeditezi,ai o eroare la code
o am si eu si deja ma enerveaza

Re: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 5:48 am

Acum trebuie sa fie ok.(apasa pe ultimul bbcode "Schimba modul de editare") Smile

Re: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 7:33 am

nu ai inteles..
inlocuieste imaginea de fundal cu una proprie aceleasi dimensiuni ca sa vezi exact despre ce vorbesc.

Re: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 10:02 am

Deci.... sa reluam problema: Totul se datoreaza fundalului, pe care vrei sa-l schimbi cu : [Trebuie sa fiti inscris si conectat pentru a vedea acest link] , insa cum acesta s-a redimensionat si si-a pierdut la upload dimensiunile initiale nu se poate fixa asa cum doresti. E ok pana aici?

Daca da, eu ti-am recomadat sa incerci sa reuploadezi imaginea si sa ai grija ca optiunea Redimensioneaza imaginea? sa fie setata pe "nu". Wink

Dupa ce ai facut acest lucru, in codul tau body ve-i modifica height si width cu marimea in pixeli a imaginii. Ce este neclar pana aici Question

Re: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 11:06 am

Cod:

Deci.... sa reluam problema: Totul se datoreaza fundalului, pe care vrei sa-l schimbi cu : http://i80.servimg.com/u/f80/14/12/03/12/fundal10.png , insa cum acesta s-a redimensionat si si-a pierdut la upload dimensiunile initiale nu se poate fixa asa cum doresti. E ok pana aici?

revin cu editare

EDITARE: ai avut dreptate cu: "Do Not Resize" nu am dat niciodata atentie
Multumesc,poti inchide

Re: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 11:31 am

Topic rezolvat! Inchis!

Re: [REZOLVAT]background pe tot ecranul

Mergi direct la:

Permisiunile acestui forum:

Nu puteti raspunde la subiectele acestui forum

Conectați-vă pentru a răspunde

[REZOLVAT]background pe tot ecranul

description[REZOLVAT]background pe tot ecranulDum Iun 16, 2013 10:06 am

descriptionRe: [REZOLVAT]background pe tot ecranulDum Iun 16, 2013 10:26 am

descriptionRe: [REZOLVAT]background pe tot ecranulDum Iun 16, 2013 12:49 pm

descriptionRe: [REZOLVAT]background pe tot ecranulDum Iun 16, 2013 12:56 pm

descriptionRe: [REZOLVAT]background pe tot ecranulDum Iun 16, 2013 1:18 pm

descriptionRe: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 5:45 am

descriptionRe: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 5:47 am

descriptionRe: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 5:48 am

descriptionRe: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 7:33 am

descriptionRe: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 10:02 am

descriptionRe: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 11:06 am

descriptionRe: [REZOLVAT]background pe tot ecranulLun Iun 17, 2013 11:31 am

descriptionRe: [REZOLVAT]background pe tot ecranul