Arkusze CSS - rady i triki

akapity w paragrafach

Prosty przypadek: akapity w pierwszej linii każdego paragrafu. Wielu uważa, że tekst jest przez to czytelniejszy, szczególnie długi tekst. Pozwala to również na używanie pustych lini dla ważniejszych przerw.

Trikiem jest stosowanie akapitów tylko w odzielnych paragrafach następujących po sobie. Pierwszy paragraf nie musi mieć akapitu, tak jak nie trzeba stosować akapitu w paragrafach po wykresach, nagłówkach lub czymś innym co i tak jest odzielone od reszty tekstu. Reguły są bardzo proste:

p {
  margin-bottom: 0 }
p + p {
  text-indent: 1.5em;
  margin-top: 0 }

Tworzy to akapit w pierwszej linii tylko w paragrafach następujących po sobie. Ukrywa również przestrzeń poniżej wszystkich paragrafów i w paragrafach z akapitem. W praktyce okazuje sie, że są jednak wyjątki.

Na tej stronie znajdują sie elemety, które użyte są jako opisy obrazów (zobacz powyższy przykład). Zostały one wyśrodkowane i nie mają posiadać akapitów. Prosta reguła 'p.caption {text-indent: 0}' może o to zadbać. Można zaobserwować, że rzeczywiście użyliśmy jej w tym przykładzie.

Możemy teraz używać różnej ilości pustych przestrzeni pomiędzy paragrafami do wskazania ważnych przerw w tekscie. Zdefiniujmy trzy klasy: stb (mała przerwa tematyczna), mtb (średnia przerwa tematyczna) and ltb (duża przerwa tematyczna). Przypisaliśmy temu paragrafowi klasę stb, i oto rezultat:

p.stb { text-indent: 0; margin-top: 0.83em }
p.mtb { text-indent: 0; margin-top: 2.17em }
p.ltb { text-indent: 0; margin-top: 3.08em }