stronie - Kurs HTML i CSS
AutoIFRAME / Automatyczne dopasowanie wysokości ramki HTML...Struktura tabeli). Jest to wygodne o tyle, że pozwala szybko zbudować stronę elastyczną w aktualizacji, bez wykorzystania języków skryptowych po stronie serwera (np. PHP). Niestety takie rozwiązanie ma przynajmniej jedną poważną wadę: trudno jest dopasować wysokość ramki IFRAME tak, aby była odpowiednia dla każdej rozdzielczości ekranu. Jeśli ustalimy za duży rozmiar, użytkownicy w niskiej rozdzielczości będą mieli problem z przewijaniem zawartości ramki. Natomiast jeśli ustalimy za mały...
- Galeria zdjęć HTML / Klasyczna galeria zdjęć
...galerię zdjęć, stosowaną do przedstawienia kolekcji zdjęć, zwykle o dużych rozmiarach. Najczęściej jest ona tworzona w ten sposób, że na głównej stronie umieszcza się pomniejszone kopie obrazków oraz odsyłacze, po kliknięciu których następuje wczytanie obrazka w pełnych rozmiarach. Pozwala to uchronić się od wczytywania wszystkich dużych obrazków jednocześnie (użytkownik powiększa tylko te, które mu odpowiadają), a także zachowuje estetykę strony. Uwaga! Miniaturki grafik muszą być...
- Wykaz generatorów
...Totalna zmiana wyglądu pól formularza, a wszystko całkowicie automatycznie. Generator daty i czasu HTML5 Oznaczaj daty i godziny na swojej stronie szybko, łatwo i przyjemnie. Konwerter HTML/Tekst Narzędzie pomocne w przypadku, kiedy chcemy wyświetlić na stronie WWW kod źródłowy HTML (w normalnych warunkach nie można tego zrobić, ponieważ kod znaczników nie pojawia się na ekranie). Dodatkowo zawiera opcje inteligentnego trybu preformatowanego, dzięki któremu nie trzeba wstawiać...
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...
- Układ wielokolumnowy CSS / Multi-column layout
...gazetowym układzie strony, tekst z końca jednej kolumny tabeli nie przechodzi automatycznie na początek kolejnej, umieszczonej po jej prawej stronie. Po zmianie wielkości lub rodzaju czcionki, tekst w kolumnie tabeli ułoży się w zupełnie inny sposób - najprawdopodobniej wysokość przestrzeni zajmowanej przez tekst w kolumnach nie będzie identyczna. Na niewielkich ekranach - np. telefonów komórkowych - ustalona zbyt duża liczba kolumn w tabeli może sprawić, że będą one zdecydowanie zbyt...
HTML5 / Nagłówek <header>...tworzy nowej sekcji w dokumencie (zobacz: "Sekcje / Nagłówki sekcji" w rozdziale "Nowe elementy HTML5"). Przykład <header> <header> <p>Witam na stronie...</p> <h1>Kurs języka HTML</h1> </header> Skoro znacznik HEADER nie tworzy nowej sekcji, to dla tak przedstawionego dokumentu: <header> <h1>Sekcja 1</h1> <p>Akapit sekcji 1</p> <h2>Podsekcja 1.1</h2> </header> <p>Akapit podsekcji 1.1</p> <h2>Podsekcja 1.2</h2> <p>Akapit podsekcji 1.2</p> ...automatyczny spis treści będzie wyglądał...
HTML dla zielonych / Ćwiczenia...stronę o sobie, może to być po prostu Twoje zdjęcie. Stwórz podstronę o nazwie linki.html (nowy plik HTML w edytorze) i umieść do niej odsyłacz na stronie głównej (czyli w pliku index.html). O tym co to są i jak się tworzy podstrony przeczytasz w podrozdziale: Ramy dokumentu. Na podstronie linki.html wstaw odsyłacze do ciekawych stron w internecie, na których czytelnik będzie mógł znaleźć więcej informacji na opisywany przez Ciebie temat. Jeżeli tworzysz stronę o sobie, możesz tutaj...
- Nagłówek i treść HTML / Ćwiczenia
...(plik index.html) stworzoną w ramach ćwiczeń z poprzedniego rozdziału. Dodaj informację o języku, w którym została wprowadzona treść na Twojej stronie. Podaj autora strony. Zdefiniuj ikonę strony. Jeżeli nie posiadasz wystarczających umiejętności graficznych, przykładową ikonę możesz wyszukać w internecie. Pamiętaj o poszanowaniu praw autorskich! Nie każdy obrazek można swobodnie skopiować sobie na swoją stronę, jeżeli autor nie wyraził na to zgody. Jednym z serwisów, który udostępnia...
- Dziedziczenie stylów CSS / Resetowanie wszystkich wartości {all}
...cechy CSS. Problem ten rozwiązuje specjalna właściwość all, która pozwala za jednym zamachem zrobić to dla wszystkich cech CSS wybranego elementu na stronie. Wyjątkiem są jedynie własności: direction (kierunek tekstu) i unicode-bidi (algorytm dwukierunkowego tekstu), których wartości nie zostaną zmienione. Ale tak naprawdę zwykle w ogóle nie zaleca się ich używać w języku CSS, ponieważ mają one swoje odpowiedniki w języku HTML. Jednym z przykładowych zastosowań tej własności może być...
- CSS dla zielonych / Tapeta CSS {background-color, background-image, color}
Tapety graficzne umieszczone w tle są chętnie używanym elementem w każdym systemie operacyjnym. Podobne rozwiązanie można zastosować również na stronie internetowej. Najprostszym rodzajem tapety jest powielany wzorek w postaci kafelków. Przypomina on płytki położone na podłodze czy na ścianach w łazience - zakładając, że wzór na każdej płytce jest identyczny. Niewątpliwą zaletą tego typu tapety jest fakt, że można nią pokryć dowolnie dużą powierzchnię. Jest to o tyle ważne, że nie wiemy z góry...