efekt - Kurs HTML i CSS
Formularze HTML / Pole wyboru <input "checkbox">...wprowadza na ekran etykietę z tekstowym opisem pola, która jest z nim skojarzona logicznie. Dzięki temu kliknięciu etykiety powoduje zwykle taki sam efekt jak kliknięcie samego pola, tzn. jego zaznaczenie lub odznaczenie, a dodatkowo wskazanie etykiety myszką może spowodować "podświetlenie" pola. Tekst etykiety może się znajdować przed lub za elementem formularza, do którego się odnosi. Zwykle zupełnie wystarczający jest pierwszy z podanych sposobów przypisywania etykiety. Wyobraźmy sobie...
- I co dalej... / Płatne serwery
Spis treści Wstęp Rodzaje hostingu Serwer a domena internetowa Czym się różnią płatne usługi hostingowe od darmowych? Na co zwrócić uwagę wybierając płatny hosting? Ile kosztuje hosting strony WWW? Wstęp Czasem z różnych względów darmowe serwery nie będą wystarczające na potrzeby tworzonej strony WWW. Wtedy ze swoją ofertą wkraczają firmy hostingowe oferujące płatne usługi hostingowe. Czy (i kiedy) warto z nich skorzystać? Czym się różnią od darmowych? Jak je wybrać? Ile kosztują...
- HTML5 / Nowe elementy HTML5
...części (w obszernym niepodzielonym na rozdziały tekście, trudno jest się połapać). Prawidłowo oznaczone nagłówki sekcji mają również pozytywny efekt, jeżeli chodzi o pozycję tak zbudowanej strony w wynikach wyszukiwarek internetowych. Dlatego warto o to szczególnie zadbać. Do nagłówków sekcji zaliczamy następujące elementy: H1, H2, H3, H4, H5, H6. Ważne jest utrzymanie odpowiedniej kolejności numeracji poziomów nagłówków sekcji. Każdy kolejny nagłówek sekcji wstawiony w dokumencie może...
- HTML5 / Filmy i dźwięk <video, audio, source>
...W rzeczywistości większość przeglądarek nie używa takiego trybu domyślnie. W ich przypadku brak atrybutu playsinline nie wywoła żadnego efektu. poster W przypadku odtwarzacza VIDEO możliwe jest ustawienie statycznego obrazka, który wyświetli się w oknie odtwarzania, zanim użytkownik włączy w nim odgrywanie właściwego filmu. Można w ten sposób umieścić np. pierwszą znaczącą klatkę z filmu. Jako wartość tego atrybutu należy podać lokalizację pliku graficznego. preload Określa...
Wykazy CSS / Automatyczna numeracja wykazu {counter-reset, counter-increment}...jeden - dla następnego punktu lub podpunktu: ol li:before { content: counters(nazwa_licznika, ".") ". "; counter-increment: nazwa_licznika } Oto efekt: Punkt pierwszy (1.) Podpunkt pierwszy (1.1.) Podpunkt drugiego rzędu (1.1.1.) Podpunkt drugiego rzędu (1.1.2.) Podpunkt drugi (1.2.) Podpunkt drugiego rzędu (1.2.1.) Podpunkt drugiego rzędu (1.2.2.) Punkt drugi (2.) Podpunkt pierwszy (2.1.) Podpunkt drugiego rzędu (2.1.1.) Podpunkt drugiego rzędu (2.1.2.) Podpunkt...
- Tekst HTML / Wykaz <ul, ol, li>
(lista wyliczeniowa) Spis treści <ul, ol, li> Wypunktowanie - lista nieuporządkowana <ul, li> Wykaz numerowany - lista uporządkowana <ol, li> Wykaz numerowany - różne typy Wykaz numerowany z podaniem początkowego numeru Zmiana numerowania w trakcie Wykaz z wypunktowaniem innym kolorem Wykaz w akapicie Potrzebujesz pomocy? Przy tworzeniu wykazów HTML możesz również skorzystać ze specjalnego generatora zamieszczonego tutaj. Dzięki niemu w kilka minut skonfigurujesz dowolny, nawet...
- Media CSS / Zapytania mediów
...posiadały możliwości szybkiego wyświetlania tych linii, po zakończeniu rysowania ostatniej, pierwsza już była blada, co w efekcie mogłoby wywoływać efekt falującego z góry do dołu migotania jasności obrazu. Dlatego właśnie wymyślono wyświetlanie z przeplotem - najpierw wyświetlano tylko parzyste linie, a potem wracano na górę ekranu i wyświetlano nieparzyste. Taka technika znacząco zmniejszała migotanie obrazu w telewizorach starszych typów. Ponieważ skanowanie progresywne jest używane w...
- Szablon strony na DIV-ach / Płynny szablon
...menu, przylegając do lewej krawędzi okna. Zatem margines przygotowuje miejsce na kolumnę menu, która została ustawiona dokładnie nad nim. Możliwy efekt bez lewego marginesu: Nagłówek szablonu Menu nawigacyjne Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść...
- Odsyłacze HTML / Mapa odsyłaczy <img usemap, map, area>
...wokół obrazka, należy podać atrybut style="border: 0" dla znacznika <img>. Nakładanie obszarów Załóżmy, że chcemy uzyskać następujący efekt: definiujemy na przygotowanym obrazku jeden okrągły i jeden trójkątny obszar z odsyłaczami, ale chcemy dodatkowo, aby kliknięcie na dowolnych pozostałych częściach grafiki, odsyłało na osobny adres. Możemy tego dokonać definiując na końcu trzeci kształt, o takich samych rozmiarach jak wymiary całego obrazka. Jeżeli powierzchnie, zdefiniowane...
- Szablon strony na DIV-ach / Responsywny szablon
...urządzenie wskazujące np. w postaci myszki komputerowej, a inaczej na małych urządzeniach mobilnych z ekranami dotykowymi. A taki właśnie efekt pozwalają uzyskać Kaskadowe Arkusze Stylów (CSS). Można to zrobić w trzech prostych krokach opisanych poniżej. Skalowanie Aby stworzyć stronę responsywną, najpierw musimy wstawić w nagłówku dokumentu, tzn. w dowolnym miejscu pomiędzy znacznikami <head> i </head>, następuje polecenie: <meta name="viewport" content="width=device-width...