wstawianie strony - Kurs HTML i CSS
Dobre praktyki / Przykazania webmastera...elementów ani atrybutów zdeprecjonowanych Unikaj stosowania ramek - zarówno tradycyjnych jak i lokalnych Nie stosuj tabelek do budowania układu strony Nawigacja musi być intuicyjna i wygodna Unikaj używania atrybutu target="..." dla odsyłaczy Nie używaj znaczników img do wstawiania grafiki tworzącej oprawę graficzną strony Zawsze wypełniaj atrybut alt="..." dla ilustracji Zapisuj ilustracje we właściwych formatach graficznych Stosuj fizycznie pomniejszone miniatury zdjęć Strona...
Dla nauczycieli / Scenariusz lekcji informatyki dla liceum i technikum...Omówienie roli multimediów w stronach internetowych i ich znaczenia. 10 min - Wstawianie wideo i audio Omówienie tagów <video> i <audio>, wstawianie plików multimedialnych na stronę oraz ich atrybuty (np. controls, autoplay, loop). 10 min - Wstawianie widżetów (iframe) Wyjaśnienie tagu <iframe>, jego zastosowanie i sposób osadzania zewnętrznych treści (np. YouTube). 10 min - Ćwiczenie praktyczne: strona z obrazkami, wideo i audio Uczniowie tworzą stronę, na której wstawiają...
- Oprawa graficzna / Zamiennik obrazkowy
...połączeń np. w przypadku telefonii komórkowej, może być sporym obciążeniem finansowym, a już na pewno znacząco wydłuży ładowanie strony. Statyczne wstawianie obrazków, tworzących oprawę graficzną, jest niepoprawne semantycznie. Każdy znacznik IMG obowiązkowo musi posiadać atrybut alt="...", który jest przydatny np. dla osób niewidomych. Jednak w takim przypadku będzie on kompletnie pozbawiony sensu, ponieważ nie ułatwia, tylko utrudnia odbiór treści. Syntezator mowy, używany przez osobę...
- Dla nauczycieli / Scenariusz lekcji informatyki dla szkoły podstawowej
...programowej Lekcja 1 - Wprowadzenie do HTML i struktury dokumentu Lekcja 2 - Wstawianie obrazków i linków Lekcja 3 - Dostosowanie wyglądu strony i podsumowanie Zadanie końcowe / projekt Podsumowanie Wstęp Poniżej znajdziesz scenariusz cyklu lekcji oparty na podstawie programowej dla klas IV-VIII szkoły podstawowej z zakresu informatyki oraz materiałach ze strony HTML dla zielonych. Lekcje zostały rozplanowane na 3 spotkania po 45 minut, z pracą domową i elementami pracy...
- Tło CSS / Usunięcie tła {background: none, background-color: transparent}
...zwykłe tło, a jednocześnie na innych pozostawić nadal obrazkowe, może to uczynić na dwa sposoby: Nie dołączać zewnętrznego arkusza do wybranej strony. Takie rozwiązanie nie jest jednak zbyt dobre, ponieważ musimy ręcznie wpisywać wszystkie inne deklaracje, które znajdują się w arkuszu (np. kolor tekstu na stronach), pomijając przy tym tą, która odpowiada za tło. Chociaż początkowo osiągniemy żądany efekt, jednak przy każdej modyfikacji szaty graficznej serwisu, będziemy zmuszeni...
Menu rozwijane, otwierane, wysuwane / Wygląd menu rozwijanego, otwieranego, wysuwanego...Akapit Tekst pogrubiony Tekst pochylony Tekst podkreślony Wielkość czcionki Kolor czcionki Rodzaj czcionki Nagłówek i treść Tytuł strony Deklaracja strony kodowej Opis zawartości strony Wyrazy kluczowe Język strony Tekst Akapit Tytuł Blok Koniec linii Pogrubienie CSS Czcionki Tekst Tło Marginesy Obramowanie Wykazy Rozmiary należy użyć kodu HTML: <dl id="menu0"> <dt>Kurs</dt> <dd> <dl> <dt><a href="...">HTML</a></dt> <dd> <dl>...
- Selektory specjalne CSS / Klasy selektorów <... class>
...elementów - umieścisz w zewnętrznym arkuszu stylów, tym szybciej przebiegnie późniejsza ewentualna modyfikacja stron! Dobrym pomysłem jest również wstawianie komentarza przed każdą deklaracją klasy w arkuszu (znaki: /* ... */), w którym opisuje się jej przeznaczenie. Po jakimś czasie w Twoim arkuszu stylów może znaleźć się tyle klas, że zapomnisz, do jakich elementów się one odnosiły. Wtedy właśnie bardzo przydatny może się okazać wpisany wcześniej komentarz. Przykład <... class> Jeżeli w...
- Pozycjonowanie CSS / Pozycja statyczna {position: static}
...Jest to przydatne np. w celu usunięcia ogólnej deklaracji pozycjonowania, umieszczonej w arkuszu stylów. Wystarczy wtedy, dla wybranych elementów strony, umieścić powyższe polecenie w stylu inline. Spowoduje to usunięcie pozycjonowania dla tych elementów, a jednocześnie utrzymanie dla innych (tego samego typu). Przykład {position: static} Gdyby w arkuszu stylów tej strony [zobacz: Wstawianie stylów], została umieszczona taka linijka: h1 { position: relative; left: 50% } to teraz wszystkie...
- Drukowanie CSS / Linijki na stronie {widows, orphans}
(interpretuje: Internet Explorer 8.0, Opera, Chrome) Na górze strony: selektor { widows: liczba } Na dole strony: selektor { orphans: liczba } Selektorem może być znacznik wyświetlany w bloku [zobacz: Wstawianie stylów]. Natomiast jako "liczba" należy podać minimalną ilość linijek akapitu, które muszą znaleźć się odpowiednio: na górze lub na dole strony. Powyższe polecenia nie blokują przełamania strony ani go nie wywołują. Mogą być jednak przydatne ze względów estetycznych. Na przykład...
- Czcionki CSS / Wielkość czcionki {font-size}
...2ex Procent wielkości bieżącej: Przykład rozmiar 75% Czcionka bieżąca rozmiar 150% Jeśli definiowane własności mają odnosić się do całej strony (np. wielkość czcionki na całej stronie), można użyć selektora BODY albo HTML. Najlepszy sposób ustalania wielkości czcionki Jak widać, rozmiar tekstu można definiować przy pomocy wielu jednostek, jednak wcale nie jest wszystko jedno, w jaki sposób to zrobimy. Jednostka "em" Kiedyś panowała opinia, że najlepszą jednostką do ustalania...