Visualizzazione dei risultati da 1 a 8 su 8

Discussione: [HTML] Problema zoom

  1. #1

    [HTML] Problema zoom

    Salve, sto costruendo un sito che ha una struttura simile al sito in questa foto( sito ) cioè con le bande laterali vuote e una pagina centrale in rilievo che racchiude il contenuto. Il mio problema è che, quando faccio lo zoom, il testo sballa ed esce fuori dai confini della pagina centrale. Vorrei sapere se c'è qualche proprietà che devo aggiungere al testo (magari tramite il file .css) oppure se c'è qualche altro trucco o escamotage.

    PS:La mia pagina centrale è un immagine png (suppongo che in tutti i siti che usano questo stile sia così)

    Grazie per la disponibilità.

  2. #2
    Che dimensione hai impostato per il contenitore? Se non posti codice e link è difficile immaginare il problema

  3. #3
    Originariamente inviato da Simonetta72
    Che dimensione hai impostato per il contenitore? Se non posti codice e link è difficile immaginare il problema
    il file html è questo:
    Codice PHP:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd"
    >
    <
    html lang="it">
    <
    head>
    <
    meta http-equiv="Content-type" content="text/html charset=ISO-8859-1">
    <
    meta name="Author" content="Leonardo Urbano">
    <
    meta name="keywords" lang="it" content="Hardware, PC, Processore, Scheda Madre, Stampante, Scheda Video, Hard Disk, Router, Speakers, Notebook, Netbook">
    <
    meta name="description" content="TrignoPC Store è un sito dove potrete acquistare i migliori prodotti di informatica,delle migliori marche, a prezzi ottimi">
    <
    title>TrignoPC Store</title>
    <
    link rel="stylesheet" href="base.css" type="text/css" media="screen">
    </
    head>
    <
    body>
      <
    h1 id="posscritta"Ciao </h1>
      [
    img]logo.png[/img
    </
    body>
    </
    html
    il file css è questo:

    Codice PHP:
    body 
    background-color:#FFDC51; background-image:url("sfondo.png");
    background-position:top center;
    background-repeat:no-repeatwidthautoheightauto

    #sizelogo { 
    position:absolute
    left:18%; 
    top:5%; 
    width17%; 
    height20%; 
    z-index2; } 
    #posscritta 
    position:absoluteleft:18%; top:30%; z-index3; } 
    e il link è questo

    Il problema dello zoom l'ho risolto mettendo lo sfondo.png il logo e la scritta nello stesso contenitore div, ma la soluzione non mi sembra buona, visto che vorrei impostare l'immagine di sfondo nel css tramite background-image.

  4. #4
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    Via i posizionamenti assoluti:

    codice:
    css:
    
    body
    { 
     background-color:#ffdc51;
    }
    #container {
     width:875px; /* la larghezza totale, aggiungendo il padding, equivale a quella dell'immagine*/
     height:1300px;
     background-image:url(sfondo.png);
     background-repeat:no-repeat;
     margin:0 auto;
     padding:35px; /* per far sì che i contenuti non siano al di sopra del riquadro ma distanziati dai bordi dell'immagine*/
    }
    #logo {
     margin-bottom:30px;
    }
    
    html:
    
    <body>
    <div id="container">
      <div id="header">
        <div id="logo">[img]logo.png[/img]</div>
        <h1> Ciao</h1>
      </div>
    </div>
    </body>
    </html>

  5. #5
    Grazie ad entrambi...@Prill in questo modo il sito mi viene visualizzato in modo diverso su pc con diversa risoluzione??

  6. #6
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    in questo modo a tutte le risoluzioni il box che contiene tutto (su cui ho impostato lo sfondo) sarà sempre al centro della pagina, e i suoi contenuti lo seguiranno mantenendo le stesse posizioni gli uni rispetto agli altri e al contenitore stesso

    aggiungo: non usare immagini grandi (il logo) da far ridimensionare al browser, per avere un file che si carica più velocemente usa immagini che abbiano le dimensioni con le quali poi dovranno essere effettivamente visualizzate (e che saranno in quanto più piccole anche meno pesanti)

  7. #7
    Un'ultima cosa...visto che la parte dell'intestazione (per ora c'è solo il logo) e il menù che aggiungerò in futuro saranno uguali in tutte le pagine, devo ricopiare tutto quel codice in tutte le pagine oppure devo fare in modo che ,navigando da pagina a pagina, cambi solo il contenuto e quindi,il codice relativo all'intestazione e al menù li scrivo solo una volta?? (javascript e dom??)

  8. #8
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    Php (o asp, dipende dal linguaggio supportato dal tuo server)

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.