Už jste někdy chtěli odsazení druhého řádku položku seznamu namísto toho se objeví přímo pod bullet point? To je pravděpodobně důvod, proč jste tady, a níže je pravděpodobně výsledek, který hledáte:
Dnes se budeme ukázat vám snadný způsob, jak to udělat.
důvodem, proč se to děje, je to, že klíště je vložený obsah, takže když text zabalí, bude pokračovat jako obvykle.
toto chování můžete zastavit využitím text-indent:
vlastnost text-indent určuje, kolik vodorovného prostoru by mělo zůstat před začátkem prvního řádku textového obsahu prvku.
zadáním záporné odrážky textu můžete říct, že první řádek posune požadovanou částku doleva. Pokud pak zadáte kladné polstrování-vlevo můžete tento posun zrušit.
V následujícím příkladu hodnota 20px:-
ul { list-style: none; width: 200px; text-indent: -20px; /* key property */ margin-left: 20px; /* key property */ }li { margin-bottom: 10px; }A tady to máte, tady je CodePen výše v akci.