Visualizzazione dei risultati da 1 a 2 su 2
  1. #1

    Ridimensionamento immagine e centraggio frase orizzontale e verticale

    Salve sono nuovo del forum e sto imparando l'uso dell' HTML per scopi universitari.

    Premetto che prima di scrivere direttamente ho cercato piu' e piu' volte nella funzione cerca e non ho trovato nulla che facesse esattamente al caso mio, quindi passiamo al pratico


    Quanto mi è richiesto è questo :

    1) Inserire il proprio nome centrato orizzontalmente e verticalmente.
    2) inserire un immagine di sfondo non replicata della dimensione della pagina stessa.

    Io vi posto quanto ho provato a fare io e vediamo se insieme riusciamo a riaggiustare il codice che sicuramente è sbagliato in qualche punto.








    <html>
    <head>
    <title> Prova di oggi </title>
    </head>
    <body background="http://www.gapers.it/Image/marte.jpg">
    <center>
    <div style="padding-top:21%">
    <A HREF="C:\Users\Nicola\Desktop\Link Esame completo nuovo.html"> NICOLA DAPOZZO</A>
    </div>
    </center>
    </body>
    </html>



    Mi esce l'immagine non dimensionata alla pagina ( sarebbe meglio se si auto-adattasse ai diversi schermi ) , replicata, e il nome è centrato correttamente orizzontalmente ma verticalmente sono andato a occhio



    HELP !!!!!

  2. #2
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    un esempio usando display:table (e table-cell) che è uno dei vari metodi per centrare verticalmente. Considera che andrà specificato un doctype, e anche indicata una codifica per i caratteri (sui quali puoi cercare info in rete, indipendentemente da ciò che uso io). Fondamentale poi specificare un'altezza del 100% per i contenitori:

    codice:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Documento senza titolo</title>
    <style type="text/css">
    <!--
    html, body {
        height:100%;
        margin:0;
        padding:0;
    }
    body {
        background:url(immagine.jpg) no-repeat;
        background-size: 100%;
    }
    #myDiv {
        width:100%;
        height:100%;
        display:table;
    }
    p {
        display:table-cell;
        text-align:center;
        vertical-align:middle;
    }
    -->
    </style>
    </head>
    
    <body>
    <div id="myDiv"><p>text text text</p></div>
    </body>
    </html>

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.