Archiwa tagu: łamanie linii br

html-10 | WebQuest – Kolor tekstu i tła w html.

Zadanie (WebQuest) do ee.09:

I. Wprowadzenie.
Aby uzyskać pożądany wygląd strony oprócz wstawiania grafik definiujemy kolor tła strony i tekstu. N
ajwiększą czytelność strony uzyskujemy stosując takie zestawianie kolorów, które nie będą się ze sobą zlewały, coś na wzór czarnego  koloru tekstu i białego tła.

II. Zadanie.
Temat:  Kolor tła, tekstu  w html.

Opis:
Na podstawie poprzedniego ćwiczenia utwórz folder 10-html oraz dodaj opis budowy znacznika.
Wyniki zapisz w pliku 10-html-Klasa-Nr.pdf

Strona ma zawierać elementy w maksymalnie zbliżonej konfiguracji działające pod adresem:
http://localhost/html/html-10/ w pliku index.html
Według wzoru: 

III. Proces.

Krok 1. Utwórz kopię katalogu 9-html  lokalizacji serwera xampp w katalogu htdocs/html  i nadaj mu nazwę 10-html.
Krok 2. W kodzie źródłowym strony dodaj wpis „Temat …” jak na  powyższym zrzucie.
Krok 3.  W kodzie źródłowym po temacie między podpisem wstaw informacje jakich operatorów możemy użyć by kolorować tekst i tło pod tekstem tak jak  na  powyższych zrzutach.
Pamiętaj, że użycie składni <w nawiasach ostrych > skutkuje wykorzystaniem tego znacznika w budowaniu strony,  rozwiązaniem tego problemu jest zastosowanie nawiasów ostrych w zapisie encji &lt; oraz &gt; 
Krok 4. Wykonaj ćwiczenie z poniższym tekstem (wstaw wpis „Ćwiczenie” i linię poziomą). Opis  ćwiczenia nie jest konieczny

Najpopularniejsze kolory zapisz w nazwie systemowej i rgb.
W paragrafie zapisz fonty w formacie <p> <font style=”color:systemowy” > kolor systemowy</font> <font style=”color:rgb” > zapis rgb </font> </p>

black #000000
silver #C0C0C0
white #FFFFFF
maroon #800000
red #FF0000
purple #800080
fuchsia #FF00FF
green #008000
lime #00FF00
olive #808000
yellow #FFFF00
navy #000080
blue #0000FF
teal #008080
aqua #00FFFF

Krok 5.  Wyświetl źródło strony  (w przypadku oddawania pracy w pliku poniżej zrzutu  wklej zwartość strony w formie tekstu)

IV. Źródła.
V. Ewaluacja.

Ocena pliku 10-html-Klasa-Nr.pdf.
Pięć poprawnie wykonanych kroków opartych  na podpisanych zrzutach wraz z punktami autoryzacji dają 100 %
Punkty ujemne:
– brak autoryzacji na zrzutach ekranu
– brak tematu zadania
– brak opisu stosowania nagłówka i indexu tekstu
– brak ćwiczenia 

– błędy w opisie składni

VI. Konkluzja

Sprawdź swoją wiedzę rozwiązując poniższy test:

Zapis HSLA to

Użycie style="background-color:white" na białym tle strony w tagu font

Domyślnym kolorem tekstu wyświetlanym w przeglądarce (bez definicji stylu)

Zapis RGB koloru #FFFFFF

RGB to zestawienie kolorów

html-9 | WebQuest – Tekst: rodzaje nagłówków, index: górny i dolny.

Zadanie (WebQuest) do ee.09:

I. Wprowadzenie.
Wielkość tekstu  na stronie spełnia dwie najważniejsze funkcje, pierwsza wyznacza wagę treści druga na tej samej zasadzie daje informację robotom indeksującym, ważny tekst dużą czcionką. Uwaga rozmiar czcionki w  indeksowaniu treści drugim przypadku nie może być jednolity.

II. Zadanie.
Temat:  Nagłówek i index tekstu.

Opis:
Na podstawie poprzedniego ćwiczenia utwórz folder 9-html oraz dodaj opis budowy znacznika.
Wyniki zapisz w pliku 9-html-Klasa-Nr.pdf

Strona ma zawierać elementy w maksymalnie zbliżonej konfiguracji działające pod adresem:
http://localhost/html/html-9/ w pliku index.html
Według wzoru: 

 

III. Proces.

Krok 1. Utwórz kopię katalogu 8-html  lokalizacji serwera xampp w katalogu htdocs/html  i nadaj mu nazwę 9-html.
Krok 2. W kodzie źródłowym strony dodaj wpis „Temat …” jak na  powyższym zrzucie.
Krok 3.  W kodzie źródłowym po temacie między podpisem wstaw informacje jakich operatorów możemy użyć do tworzenia nagłówków i indexów tekstu jak  na  powyższym zrzucie.
Pamiętaj, że użycie składni <w nawiasach ostrych > skutkuje wykorzystaniem tego znacznika w budowaniu strony,  rozwiązaniem tego problemu jest zastosowanie nawiasów ostrych w zapisie encji &lt; oraz &gt; 
Krok 4. Wykonaj ćwiczenie z poniższym tekstem (wstaw wpis „Ćwiczenie” i linię poziomą).

Chmura tagów(st6)
czyli linków(st5).
Identyfikuje ważność linka(st3)
także po wielkości(st2)
czcionki(st1)
Górny czy dolny index jest bez znaczenia.

Krok 5.  Wyświetl źródło strony  (w przypadku oddawania pracy w pliku poniżej zrzutu  wklej zwartość strony w formie tekstu)

IV. Źródła.
V. Ewaluacja.

Ocena pliku 9-html-Klasa-Nr.pdf.
Pięć poprawnie wykonanych kroków opartych  na podpisanych zrzutach wraz z punktami autoryzacji dają 100 %
Punkty ujemne:
– brak autoryzacji na zrzutach ekranu
– brak tematu zadania
– brak opisu stosowania nagłówka i indexu tekstu
– brak ćwiczenia 

– błędy w opisie składni

VI. Konkluzja

Sprawdź swoją wiedzę rozwiązując poniższy test:

Nagłówek stopnia <h2> tekst </h2>

Index górny to tag:

Użycie indexu dolnego w znaczniku <title> </title> w sekcji head

Wewnątrz nagłówka stopnia 1 wpisanie znacznika kursywy spowoduje

W przypadku powiększenia tekstu ma stronie do wartości 150% znaczniki

html-2 | WebQuest – Zastosowanie br i hr – słów kluczowych.

Zadanie (WebQuest) do ee.09:

I. Wprowadzenie.
Przeglądarki 
(Chrome, Firefox, Opera itp.) analizują kod źródłowy w naszym przypadku ..1-html/index.html szukając słów kluczowych (ang. keyword). Słowa kluczowe to inaczej znaczniki stanową dla przeglądarki rozkazy, które ma wykonać. Każda przeglądarka niezależnie od systemu (Android, Windows, Linux) musi działać jak interpreter.

II. Zadanie.
Temat: Łamanie linii tekstu oraz użycie linii poziomej.

Opis:
Na podstawie poprzedniego ćwiczenia utwórz folder 2-html oraz dodaj znaczniki łamania linii oraz linii poziomej.
Wyniki zapisz w pliku 2-html-Klasa-Nr.pdf

Strona ma zawierać elementy w maksymalnie zbliżonej konfiguracji działające pod adresem:
http://localhost/html/html-2/ w pliku index.html
Według wzoru: 

III. Proces.

Krok 1. Utworz kopię katalogu 1-html  lokalizacji serwera xampp w katalogu htdocs/html  i nadaj mu nazwę 2-html.
Krok 2. Na końcu linii kodu html z tekstem dodaj znacznik łamania linii, sprawdź wyniki działania.
Krok 3. Przed tekstem oraz po tekście dodaj znaczniki końca linii, sprawdź wyniki działania.
Krok 4. Wyświetl źródło strony.

IV. Źródła.
V. Ewaluacja.

Ocena pliku 2-html-Klasa-Nr.pdf.
Cztery poprawnie wykonane kroki oparte na podpisanych zrzutach wraz z punktami autoryzacji dają 100 %
Punkty ujemne:
– brak autoryzacji na zrzutach ekranu
– brak elementów łamania linii
– brak elementów linii poziomej

VI. Konkluzja

Sprawdź swoją wiedzę rozwiązując poniższy test:

Kody źródłowe to pliki

Kody źródłowe HTML nie realizują,

Tag <hr> realizuje na stronie funkcję

Słowa kluczowe w języku html to

Łamanie linii to znacznik