Visualizzazione dei risultati da 1 a 10 su 10

Discussione: Css e stampa

  1. #1

    Css e stampa

    ciao a tutti,
    sarei grato se mi aiutaste che sto andando al manicomio!

    ho poco tempo per risolvere 2 problemi relativi alla stampa corretta di un sito:
    - fare in modo che nella stampa non venga visualizzato il classico menu dinamico in javascript(quello che si espande);
    - capire come è possibile far rientrare nel foglio A4 il banner che resta leggermente tagliato sulla destra.

    vi ringrazio di cuore

  2. #2
    Frontend samurai L'avatar di fcaldera
    Registrato dal
    Feb 2003
    Messaggi
    12,924
    La soluzione è un CSS per la stampa da includere nell'header delle pagine

    <link rel="stylesheet" href="stampa.css" type="text/css" media="print" />

    all'interno del quale
    1) nascondi il contenitore del menu con display: none
    2) dichiari le dimensioni dell'immagine/banner in cm o mm
    Vuoi aiutare la riforestazione responsabile?

    Iscriviti a Ecologi e inizia a rimuovere la tua impronta ecologica (30 alberi extra usando il referral)

  3. #3
    ahimè, nn è cosi semplice:

    1) sto impazzendo da stamattina, ho navigato il mondo intero: pare che nn si risolve nulla facendo "display: none" nel caso dei menu dinamici; ho provato addirittura a mettere le mani nello script del menu ma niente, il problema sembra più complicato del previsto;

    2) mi fai un esempio, gentilmente?

    -----------------------
    ti posto il file, i css:
    .............................

    <head>
    <title>Gestione Patrimonio - Home</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

    <link rel="stylesheet" type="text/css" href="stile.css">
    <link media="print" rel="stylesheet" href="stampa.css" type="text/css">


    </HEAD>
    <BODY>


    <div id="logo">[img]img/logo1patr.jpg[/img]</div>

    <div id="bar">[img]img/bar1.jpg[/img]</div>

    <div id="bianco">[img]img/bianco.jpg[/img]</div>

    <SCRIPT language=JavaScript src="menu.js"></SCRIPT>
    <NOSCRIPT>Il tuo browser non supporta javascript</NOSCRIPT>

    <div id="agg">
    <script language=JavaScript src="aggiornamento.js"></script>
    <NOSCRIPT>Il tuo browser non supporta javascript</NOSCRIPT></div>


    <div id="boxtitle">
    <p align="left">
    Home
    </div>

    <div id="box">
    <p align="justify">La mia azione si svolge in Spagna, a Siviglia, al tempo piú
    pauroso dell’inquisizione quando ogni giorno nel paese ardevano i roghi per
    la gloria di Dio e con grandiosi autodafé si bruciavano gli eretici. p>
    </div>
    </BODY>
    <HTML>

    ------------------------------------------------------------
    "stile.css"
    -----------------------------------------------------
    body {
    margin-top: 0px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 12px;
    }

    #logo {
    width: 797px;
    margin: 0px auto;
    }

    #bianco {
    width: 797px;
    margin: 0px auto;
    margin-top: 0px;
    }

    #bar {
    width: 797px;
    margin: 0px auto;
    margin-top: 28px;
    }

    #agg {
    width: 797px;
    text-align: right;
    margin: 0px auto;
    margin-top: 2px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 10px;
    }

    #boxtitle {
    width: 797px;
    margin: 0px auto;
    margin-top: 60px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: gray;
    }

    #box {
    width: 797px;
    margin: 0px auto;
    margin-top: 10px;
    }

    ---------------------------------------
    stampa.css
    -------------------------------
    #logo {
    display : block;
    width : 170mm;
    }

    #menu {
    dispaly: none;
    visibility: hidden;
    hieght: 0px;
    content: "";
    }

    #bar {
    display: none;
    }

    #agg {
    display: none;
    }

    #boxtitle {
    margin: 0px auto;
    margin-top: 60px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: gray;
    }

    #box {
    display : block;
    width : 170mm;
    }

  4. #4
    Frontend samurai L'avatar di fcaldera
    Registrato dal
    Feb 2003
    Messaggi
    12,924
    1) devi contornare questo pezzo di codice

    <SCRIPT language=JavaScript src="menu.js"></SCRIPT>
    <NOSCRIPT>Il tuo browser non supporta javascript</NOSCRIPT>

    con un blocco (ad esempio un div) così

    <div id="mainmenu">
    <SCRIPT language=JavaScript src="menu.js"></SCRIPT>
    <NOSCRIPT>Il tuo browser non supporta javascript</NOSCRIPT>
    </div>

    e sul css per la stampa scrivi

    #mainmenu {
    display : none;
    }


    2) non capisco quale parte del codice che hai postato riguarda il banner. E' un'immagine generica, un oggetto flash...? Ad ogni modo puoi dimensionare l'elemento in questione: se hai un codice del tipo
    [img]banner.gif[/img]

    nel css puoi provare ad impostare una larghezza di stampa ragionevolmente sicura ad es. 155mm

    #tuobanner {
    width : 155mm;
    }




    Ciao

    Vuoi aiutare la riforestazione responsabile?

    Iscriviti a Ecologi e inizia a rimuovere la tua impronta ecologica (30 alberi extra usando il referral)

  5. #5
    (scusa, l'html che ti ho postato era una versione vecchia)

    1) cmq ho provato a fare come dici tu
    1) devi contornare questo pezzo di codice

    <SCRIPT language=JavaScript src="menu.js"></SCRIPT>
    <NOSCRIPT>Il tuo browser non supporta javascript</NOSCRIPT>

    con un blocco (ad esempio un div) così

    <div id="mainmenu">
    <SCRIPT language=JavaScript src="menu.js"></SCRIPT>
    <NOSCRIPT>Il tuo browser non supporta javascript</NOSCRIPT>
    </div>

    e sul css per la stampa scrivi

    #mainmenu {
    display : none;
    }
    sia per uno script sull'ultimo aggiornamento della pagina (e funziona) che per lo script del menu (ma per quest'ultimo non va). dev'esserci qualcosa negli script dei menu dinamici che non consente quest'operazione, anche perchè questo problema è abbastanza comune se fai qualche ricerca, ma non ho trovato nessuna soluzione. per me andrebbe bene anche coprirlo con una barra bianca, purchè non sia visibile sul foglio stampato. ti lancio una sfida: qui sta il file (http://xoomer.alice.it/pacovitiello/menu.js)...inseriscilo in una pagina vuota e prova tu stesso a fare in modo che nn vada in stampa!

    2) il .jpeg in questione ha come ID="logo". è largo 797 pixel e vorrei fare in modo che entri tutto in larghezza su un foglio A4: quale è la dicitura da inserire nel file css?

    GRAZIE e scusa il disturbo

  6. #6
    buongiorno...scusate se insisto, ma non si può far nulla?

  7. #7
    ragazzi, vi prego, aiutaaaaaaatemi!

  8. #8
    a quanto pare nessuno se l'è sentita di raccogliere la sfida...

  9. #9
    ciao!
    il tuo atteggiamento nei confronti del forum è sbagliato: qui non ci sono nè sfide nè sfidanti, ma gente che si da una mano. detto questo, vengo al problema. come ti ha detto Fabrizio, devi tenere presente innanzitutto il media di destinazione:
    http://www.w3.org/TR/CSS21/page.html

    il media "paged" ha regole diverse dal media "visual". procedi così:

    1. imposta le dimensioni del foglio. devi pensare ad un foglio, non ad una pagina web. imposta i margini per body usando le misure assolute: pt, mm, cm.
    2. azzera tutit i menu con 'display: none;'
    3. se vuoi che un'immagine stia su un foglio, prima devi vedere quanto è grande l'immagine.
    se vuoi che l'immagine abbia tutte le sue dimensioni imposta:

    codice:
    img {width: 100%;}
    o usa un selettore di classe o di id o altro.
    4. per gli script, c'è il forum di scripting.

    ciao

  10. #10
    a quanto pare nessuno se l'è sentita di raccogliere la sfida...
    cmq era un modo scherzoso per sollecitare a una risposta...

    grazie per i consigli, provo un pò e ti faccio sapere

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 © 2026 vBulletin Solutions, Inc. All rights reserved.