Przejdź do treści

daje html - Kurs HTML i CSS

  • HTML
    Formularze HTML / Pole wyboru <input "checkbox">

    ...aby pole tekstowe było zablokowane, dopóki użytkownik nie zaznaczy tego pola wyboru. Statyczny HTML nie udostępnia takich możliwości, jednak problem daje się łatwo rozwiązać za pomocą JavaScript: <input type="checkbox" name="nazwa" value="wartość" onclick="this.form.elements['nazwa2'].disabled = !this.checked"> <input type="text" name="nazwa2" disabled> Przykład <input "checkbox" onclick> Po wybraniu opcji, pole tekstowe zostanie odblokowane: Możliwe jest również odblokowanie kilku pól...

  • HTML
    HTML5 / Możliwy koniec linii <wbr>

    ...w długiej linijce nie umieścimy żadnego białego znaku (np. spacji) ani innego, po którym normalnie może nastąpić przełamanie wiersza. Znacznik WBR daje przeglądarce możliwość przełamania wiersza w tym miejscu, jeśli tekst nie zmieści się w założonej szerokość. Od znacznika BR różni się tym, że nie wymusza przełamania wiersza, jeśli nie ma takiej potrzeby. Po co zatem w ogóle blokować zawijanie linijek, żeby potem to odblokowywać za pomocą elementu WBR? W tradycyjnym akapicie tekstu nie mamy...

  • CSS
    Czcionki CSS / Wielkość czcionki {font-size}

    ...mobilnych, które posiadają zwykle niewielki ekran. W takim przypadku jednak i tak pozostała cześć stylizacji dokumentu najczęściej nie nadaje się do wyświetlenia na ekranie np. telefonu komórkowego. Znacznie lepszym pomysłem jest przygotowanie osobnego arkusza CSS, przeznaczonego specjalnie dla medium handheld. Używanie "em" posiada natomiast bardzo poważną wadę. Pamiętajmy, że "1em" to tyle samo co "100%", a więc jest obliczane zawsze względem jakiejś wartości bazowej, wyrażonej...

  • CSS
    Wykazy CSS / Niestandardowy typ stylu wykazu @counter-style

    ...operacje arytemtyczne: Jeżeli mniejsza cyfra stoi przed większą, odejmujemy ją od tej drugiej - np.: IV = 5 - 1 = 4 W przeciwnym razie dodajemy cyfry do siebie - np.: VII = 5 + 1 + 1 = 7 Deklaracja "system: additive" działa analogicznie jak liczby rzymskie, ale obsługuje tylko dodawanie, a nie odejmowanie. Przykład @counter-style {system: additive} Tak by wyglądały liczby rzymskie, gdyby wchodziły w skład systemu czysto addytywnego (zwróć uwagę, że liczba 4 nie jest poprawnym...

  • HTML
    HTML5 / Automatyczna kapitalizacja tekstu <... autocapitalize>

    ...ma zostać wpisana. Inne rodzaje wprowadzania tekstu, na przykład wprowadzanie głosowe, mogą wykonywać automatyczną kapitalizację w sposób, który nie daje użytkownikom możliwości wcześniejszej interwencji. Atrybut autocapitalize="..." pozwala kontrolować takie zachowanie.

  • CSS
    Wykazy CSS / Automatyczna numeracja wykazu {counter-reset, counter-increment}

    ...jednak zrobić, jeżeli nie odpowiada nam taki sposób numeracji punktów albo nie możemy z góry określić ile będziemy mieli poziomów zagnieżdżenia? CSS daje na to prostą receptę - automatyczną numerację, czyli możliwość dowolnego określania sposobu numerowania elementów, np.: Punkty główne: 1., 2., 3.,... Podpunkty: 1.1., 1.2., 1.3.,... 2.1., 2.2., 2.3.,... 3.1., 3.2., 3.3.,... Podpunkty drugiego rzędu: 1.1.1., 1.1.2., 1.1.3.,... 1.2.1., 1.2.2., 1.2.3.,... 2.1.1., 2.1.2., 2.1.3.,... 2.2.1...

  • CSS
    Dobre praktyki / CSS Zorientowane Obiektowo

    ...Obiektowo (ang. Object Oriented Programming). Dlaczego by nie przenieść tego na grunt CSS? Może zabrzmi to zaskakująco, ale CSS już teraz daje taką możliwość. Nie są wymagane do tego żadne dodatkowe rozszerzenia w przeglądarkach, a jedynie zmiana sposobu myślenia webmasterów podczas projektowania arkuszy stylów. Paradoksalnie osobom, które nigdy nie programowały w językach proceduralnych, prawdopodobnie łatwiej przyjdzie zrozumienie założeń CSS Zorientowanych Obiektowo (ang. Object...

« 1 2

★★★★★ 5/5 (289)

Facebook