•  19-09-2019
  •  | 
  •  

Frage

Was könnte ich tun, um es, wie es in dem HTML-Dokument im Web-Browser sieht zu machen drucken? 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Example</title>
    </head>
    <body>
        ###### #    #   ##   #    # #####  #      ######
        #       #  #   #  #  ##  ## #    # #      #      
        #####    ##   #    # # ## # #    # #      ##### 
        #        ##   ###### #    # #####  #      #      
        #       #  #  #    # #    # #      #      #      
        ###### #    # #    # #    # #      ###### ######
    </body>
</html>

Gibt:

  # # ## # # ##### # ###### # # # # # ## ## # # # # ##### ## # # # ## # # # #> ## ### # ## ###### # # ##### # # # # # # # # # # # # ###### # # # # # # # ###### ######
War es hilfreich?

Lösung

Mit dem <pre>-Tag! Legen Sie es vor und nach dem Beispiel. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Example</title>
    </head>
    <body>
        <pre>
###### #    #   ##   #    # #####  #      ######
#       #  #   #  #  ##  ## #    # #      #      
#####    ##   #    # # ## # #    # #      ##### 
#        ##   ###### #    # #####  #      #      
#       #  #  #    # #    # #      #      #      
###### #    # #    # #    # #      ###### ######
        </pre>
    </body>
</html>

Andere Tipps

HTML ist so konzipiert, Leerraum standardmäßig kollabieren. Mit anderen Worten, alle Reihe von weißen Flächen Zeichen (Leerzeichen, Tabulatoren, Zeilenvorschübe ...) werden von einem einzigen Raum auf Rendering ersetzt. Sie können dieses Verhalten steuern, mit dem white-space CSS-Eigenschaft:

  

Die white-space CSS-Eigenschaft wird verwendet, um zu beschreiben, wie Leerzeichen innerhalb des Elements behandelt werden.

     

Werte

     
      
  • normal Sequenzen von Leerzeichen sind zusammengebrochen. Zeilenumbrüche in der Quelle werden als andere Leerzeichen behandelt. Breaks Linien nach Bedarf Zeilen-Box zu füllen.
    •   
  • pre Sequenzen von Leerzeichen erhalten sind, werden Linien nur bei Zeilenumbrüchen gebrochen in der Quelle.
    •   
  • nowrap Blendet Leerzeichen wie für normale, sondern unterdrückt Zeilenumbrüche (Textumbruch) innerhalb Text.
    •   
  • pre-wrap Sequenzen von Leerzeichen werden beibehalten. Linien werden nur auf Zeilenumbrüche in der Quelle aufgebrochen und nach Bedarf Zeilen-Box zu füllen.
    •   
  • pre-line Sequenzen von Leerzeichen sind zusammengebrochen. Die Linien werden in Zeilenumbrüchen in der Quelle aufgebrochen und nach Bedarf Zeilen-Box zu füllen.
    •   

Bei ASCII-Kunst Sie auch eine feste Breite font-family erzwingen möchten . 

.ascii-art {
    font-family: monospace;
    white-space: pre;
}
<div class="ascii-art">
###### #    #   ##   #    # #####  #      ######
#       #  #   #  #  ##  ## #    # #      #      
#####    ##   #    # # ## # #    # #      ##### 
#        ##   ###### #    # #####  #      #      
#       #  #  #    # #    # #      #      #      
###### #    # #    # #    # #      ###### ######
</div>

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top