stronie - Kurs HTML i CSS
HTML5 / Blokowanie wyświetlania <link "stylesheet" blocking, script blocking, style blocking>...równocześnie. Czasami mogłoby to jednak prowadzić do nieoczekiwanych rezultatów. Dlatego na przykład osadzenie zewnętrznego skryptu JavaScript na stronie zwykle powoduje, że przeglądarka przestaje wykonywać inne operacje, dopóki go nie załaduje i nie uruchomi. Możemy jednak pozwolić na wykonywanie niektórych czynności równolegle - np. ładowanie innych zasobów zewnętrznych osadzonych w dokumencie - a zablokować jedynie samo wyświetlanie strony (ang. render), dopóki kod skryptu nie zakończy...
- HTML5 / Element edytowalny <... contenteditable>
...należy dodać atrybut contenteditable="true" do dowolnego elementu HTML, co sprawi, że użytkownicy będą mogli edytować jego zawartość bezpośrednio na stronie. Na przykład: <div contenteditable="true">Edytowalny tekst</div>. To sprawia, że zawartość tego <div> stanie się edytowalna. Jaki jest pożytek z contenteditable w HTML? Atrybut contenteditable w HTML jest użyteczny do tworzenia obszarów na stronie, które użytkownicy mogą edytować bezpośrednio w przeglądarce, co jest przydatne w...
- HTML5 / Pominięcie walidacji formularza <form novalidate>
...Sprawdzanie poprawności formularza HTML jest użyteczne, ale często niewystarczające, zwłaszcza w bardziej zaawansowanych aplikacjach. Walidacja po stronie klienta (tzn. bezpośrednio w przeglądarce) może być łatwo omijana przez złośliwych użytkowników, dlatego powinna być uzupełniona walidacją po stronie serwera, aby zapewnić pełne bezpieczeństwo i poprawność danych. Czym jest brak sprawdzania poprawności w HTML? Brak sprawdzania poprawności w HTML oznacza celowe pominięcie procesu...
- HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
...żadnych ograniczeń. Może to być przydatne np. w przypadku wyświetlania reklam. Chcielibyśmy mieć pewność, że reklama niczego nie popsuje na naszej stronie, ale jednocześnie nie chcemy, aby po kliknięciu w reklamę strona docelowa posiadała jakiekolwiek ograniczenia. To polecenie samo w sobie nie zezwala na otwieranie okien, a jedynie zdejmuje ograniczenia, jeśli już nowe okno zostanie otwarte. Aby było możliwe otwieranie nowych okien, należy posłużyć się wartością sandbox="allow-popups...
- HTML5 / Rozmiary przycisku obrazkowego <input "image" width height>
...przycisku obrazkowego służącego do wysyłania formularza. Jeśli tego nie zrobimy, zanim obrazek się załaduje, przeglądarka zarezerwuje dla niego na stronie domyślną wolną przestrzeń. Zwykle nie będzie ona dokładnie odpowiadać rzeczywistym rozmiarom grafiki. Dlatego po załadowaniu obrazka, elementy strony w pobliżu i poniżej niego mogą przeskoczyć w dół lub na bok. Jeśli użytkownik dokładnie w tym czasie próbował kliknąć w coś na stronie, może trafić w inny element niż zamierzał.
Wstawianie stylów CSS / Wewnętrzny arkusz stylów <style>...dokumentu (pomiędzy znacznikami <head> a </head>). Można go zastosować, gdy elementy które pragniemy poddać formatowaniu, występują wielokrotnie na stronie i wszystkim chcemy nadać takie same atrybuty (inne niż domyślne). Na przykład chcemy, aby wszystkie wykazy miały automatycznie kolor niebieski. Wystarczy wpisać odpowiednią deklarację stylów w arkuszu (w treści nagłówkowej) i nie trzeba już nic dopisywać przy samym elemencie. Komentarze w arkuszu stylów pisze się używając znaków...
- Selektory pseudoklas CSS / Odsyłacz podstawowy :link
...style i zostaną opisane w dalszych rozdziałach. Polecenie pozwala nadać określone atrybuty formatowania dla wszystkich podstawowych odsyłaczy na stronie czyli takich, które nie zostały jeszcze odwiedzone przez użytkownika. Ponieważ pseudoklasa :link odnosi się tylko do odsyłaczy, w regule stylu można pominąć selektor elementu a: :link { cecha: wartość } Przykład :link Jeżeli nie byłeś jeszcze na stronie głównej organizacji W3C, to ten odsyłacz powinien być pogrubiony. Pytania i...
- Selektory pseudoklas CSS / Pseudoklasy typu :first-of-type :last-of-type :only-of-type
...wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Załóżmy, że mamy na stronie listę definicyjną itp.), która - jak wiemy - składa się ze znaczników terminów (DT) i definicji tych terminów (DD). Chcielibyśmy zmienić sposób formatowania tylko pierwszej definicji listy. Oczywiście można to zrobić nadając mu klasę. Nie jest to jednak najlepsze rozwiązanie, ponieważ niepotrzebnie zwiększa rozmiar dokumentu, a przy tym...
- Selektory pseudoklas CSS / Łączenie selektorów
...A tutaj jest odsyłacz bez klasy. Taki sposób tworzenia selektora odsyłaczy jest szczególnie przydatny, ponieważ zwykle chcemy część odnośników na stronie wystylizować inaczej, jeżeli chodzi o ich podświetlanie po wskazaniu myszką. Mogą to być np. linki z menu, które powinny wyglądać inaczej niż normalne hiperłącza w tekście. Jeżeli jednak chcemy zmienić wygląd wszystkich odsyłaczy znajdujących się w jednym miejscu - np. w menu serwisu - wygodniej jest użyć następującej reguły...
- Tekst CSS / Wyrównanie tekstu {text-align}
...stylowanie CSS do elementu zawierającego tekst, na przykład używając: <p style="text-align: center">...</p>. Jak napisać tekst po prawej stronie w HTML? Aby napisać tekst po prawej stronie w HTML, możesz umieścić tekst w odpowiednim elemencie, na przykład <p> lub <div>, a następnie użyć CSS do wyrównania go do prawej strony. Na przykład: <p style="text-align: right">...</p>.