CSS: element ograniczenia do 1 linii

Question

Chcę ograniczyć element do wyświetlania tylko 1 linii tekstu, z pozostałą częścią ukrytą (przepełnienie: ukryte), bez ustawiania określonej wysokości. Czy to możliwe dzięki właśnie CSS?

Answer 1

Jest to możliwe:

element (white-space: nowrap; overflow: scroll;) 

Tekst analizowany jako HTML lub XML jest tokenized, co oznacza, że ​​wszystkie przebiegi spacji są zwinięte do pojedynczego znaku spacji. Oznacza to, że będziesz miał pojedynczy wiersz tekstu, chyba że podasz coś oprócz deklaracji przepełnienia, która może spowodować zawinięcie tekstu.

EDYCJA: Nie udało mi się dołączyć do niezbędnej przestrzeni zapisu: nowrap, w przeciwnym wypadku domyślnie kontener przewija się pionowo w stosunku do poziomego.

Answer 2

Jeśli chcesz wyłączyć zawijanie tekstu, użyj white-space: nowrap;.

Answer 3

p#foo { 
    white-space:nowrap; 
    overflow:hidden; 
} 

Answer 4

użyj bloku wyświetlacza, aby nie przekroczył Twojego elementu nadrzędnego.

p#foo{ 
    white-space: nowrap; 
    overflow: hidden; 
    display: block; 
    text-overflow: ellipsis; 
}