W tym wpisie sprawdzimy, jak w praktyce prezentują się nasze nowe, stylowe elementy CSS. Jeśli wszystko poszło zgodnie z planem, nad tym tekstem widzisz już pięknie wygenerowany Spis treści, z którym sidebar nie wchodzi już w żadne konflikty!
Zaznacz też ten tekst kursorem myszki – tło zaznaczenia powinno być teraz w ładnym kolorze magenta.
1. Zmodyfikowane listy punktowane
Standardowe, nudne kropki odeszły do lamusa. Teraz nasze listy wyglądają znacznie nowocześniej, mają więcej oddechu i przyciągają wzrok kolorowym akcentem.
Oto dlaczego warto dbać o detale:
- Zwiększają czytelność długich bloków tekstu.
- Nadają stronie unikalny, profesjonalny charakter.
- Kierują wzrok czytelnika na najważniejsze elementy.
- Po prostu wyglądają obłędnie!
2. Eleganckie cytaty
Kiedy chcesz powołać się na czyjeś słowa lub wyróżnić ważną myśl, użyj bloku cytatu (wystarczy postawić znak > przed tekstem). Zobacz, jak ładnie odcina się teraz od reszty tekstu:
“Dobra typografia to taka, której czytelnik nie zauważa, ale dzięki której tekst czyta się z niesamowitą płynnością. Zła typografia z kolei sprawia, że oczy szybko się męczą, a treść wydaje się nudna.”
— Ktoś mądry z internetu
Zagnieżdżenia
Warto wiedzieć, że wewnątrz cytatu również możesz stosować formatowanie, takie jak pogrubienie czy linki.
3. Ramka ostrzegawcza (Alert)
Czasami trzeba przekazać czytelnikowi coś super ważnego. Czysty Markdown nie ma na to dedykowanego sposobu, ale z pomocą przychodzi nasza specjalna klasa HTML.
4. Przyklejone karteczki na podsumowanie
Na koniec każdego artykułu warto podsumować wiedzę. Nasz nowy motyw pozwala na dodanie uroczej, żółtej karteczki, która wygląda jak przyklejona do ekranu.
Spróbuj najechać na nią myszką (jeśli czytasz to na komputerze) – karteczka powinna delikatnie się wyprostować i unieść!
1. Customowy CSS potrafi zdziałać cuda z czystym Markdownem.
2. Spis treści automatycznie zbiera nagłówki H2 i H3.
3. Wystarczy trochę kodu, by blog zyskał mnóstwo charakteru.
Dzięki za czytanie!