Wyświetlanie elementu w postaci wstępnie sformatowanego tekstu za pomocą CSS

Question

Czy istnieje sposób na emulowanie wyświetlania elementu pre za pośrednictwem CSS?

Na przykład, czy mogę zachować białe znaki w tym dziale przy użyciu reguły CSS?

<div class="preformatted"> 

    Please procure the following items: 

    - Soup 
    - Jam 
    - Hyphens 
    - Cantaloupe 
</div> 

Answer 1

Zastosowanie white-space: pre zachować białymi preformatting jak w elemencie pre. Aby przejść o krok dalej, dodaj także font-family: monospace, jako że elementy są zwykle ustawione domyślnie w czcionce o stałej szerokości (np. Do użycia z blokami kodu).

.preformatted { 
 
    font-family: monospace; 
 
    white-space: pre; 
 
}

<div class="preformatted"> 
 

 
    Please procure the following items: 
 

 
    - Soup 
 
    - Jam 
 
    - Hyphens 
 
    - Cantaloupe 
 
</div>

Answer 2

Tak:

div.preformatted { 
    white-space: pre; 
    } 

referencyjny:

• white-space.

Answer 3

.preformatted { 
    white-space: pre-wrap; 
} 

myślę "pre-wrap" jest lepszy. Może pomóc w długiej kolejce.

Answer 4

Zamówienie, aby można było uzyskać <pre>;