akapity - Kurs HTML i CSS
Selektory pseudoelementów CSS / Przed... :before...Przykład :before Jeżeli w arkuszu stylów została umieszczona następująca reguła: p:before { content: "POCZĄTEK "; color: red } to wszystkie akapity będą rozpoczynały się od wyrazu "POCZĄTEK", mimo że nie wpiszemy tego wyrazu bezpośrednio w treści akapitu: To akapit, rozpoczynający się wyrazem "POCZĄTEK", pomimo że nie został on umieszczony w treści akapitu. Jeśli używasz Internet Explorera 7.0 lub starszego, powyższy akapit będzie się rozpoczynał normalnie ("To jest akapit...") - nie...
- Selektory elementów CSS / Selektor potomka
...wewnątrz elementu <div>...</div>, można użyć selektora potomka. Na przykład: div p zastosowany w regule CSS spowoduje, że zostaną wybrane wszystkie akapity wewnątrz kontenerów.
- Selektory pseudoelementów CSS / Po... :after
...Przykład :after Jeżeli w arkuszu stylów została umieszczona następująca reguła: p:after { content: " KONIEC"; color: red } to wszystkie akapity będą kończyły się wyrazem "KONIEC", mimo że nie wpiszemy tego wyrazu bezpośrednio w treści akapitu: To jest akapit, kończący się wyrazem "KONIEC", pomimo że nie został on umieszczony w treści akapitu. Jeśli używasz Internet Explorera 7.0 lub starszego, powyższy akapit będzie się kończył normalnie ("...w treści akapitu.") - nie zobaczysz...
- Selektory pseudoklas CSS / Atrybut języka :lang
...zmieni się, pomimo że blok nadrzędny posiada atrybut lang="en".</p> ...and this is end of block.</div> Na ekranie powinniśmy otrzymać pierwsze trzy akapity napisane kolorem czerwonym, a ostatni bez zmian: 1. This is paragraph with attribute lang="en". 2. This is paragraph with attribute lang="en-US". This is block with attribute lang="en"... 3. This is paragraph inside block, but without attribute lang. 4. To jest akapit wewnątrz bloku, który posiada atrybut lang="pl" i dlatego jego...
- Selektory pseudoklas CSS / Pusty element :empty
...red; width: 100%; height: 1em } a w dowolnym miejscu strony: <p></p> <p> </p> <p><b></b></p> <p>To jest akapit</p> otrzymamy cztery akapity, z których tylko pierwszy element (pusty) powinien mieć ustawione tło koloru czerwonego: document.write(' ' + ' ' + ' '); To jest akapit Zwróć uwagę, że drugi akapit (zawierający tylko spację) ani trzeci akapit (zawierający tylko pusty element-dziecko), nie otrzymały zmienionego formatowania. Przykład z użyciem elementu, który nie...
- Drukowanie CSS / Typ strony wydruku {page}
...ułożony na kartce tekst niewygodnie się czyta. Nie chcielibyśmy również zmuszać użytkownika, żeby osobno drukował strony dokumentu zawierające akapity tekstu, a potem ręcznie przestawiał orientację papieru, aby wydrukować zbyt szerokie tabele. Na szczęście dzięki CSS można rozwiązać ten problem. Strony wydruku mogą zostać nazwane przy pomocy reguły @page strona. Następnie taką nazwę wystarczy przypisać do wybranego elementu przy pomocy dowolnego selektora CSS. Pierwsze z tych poleceń...
- CSS dla zielonych / Wyrównanie tekstu CSS {text-align}
...W tym celu w arkuszu stylów wystarczy wstawić następujący kod: p { text-align: left; }. Jak wyśrodkować w CSS? Jeśli chcemy, aby wszystkie akapity na stronie były ustawione na środku ekranu, to w arkuszu stylów wystarczy wstawić następujący kod: p { text-align: center; }. Możliwe jest również wycentrowanie tylko jednego akapitu. W tym celu trzeba się jednak posłużyć kodem HTML, który wstawimy w kodzie źródłowym dokumentu HTML, a nie w arkuszu stylów CSS: <p style="text-align...