TUTAJ BĘDĄ TESTY

TESTY BASIC

TESTY Headings

Test 1 wielkości h1

Test 2 wielkości h2

Test 3 wielkości h3

Test 4 wielkości h4

Test 5 wielkości h5

Test 6 wielkości h6

TESTY Paragraphs

Test Paragraf treści pierwszy. p

Test Paragraf treści drugi. p

TESTY Links
TO JEST LINK Do latino. a href

TESTY Images

(Obrazek img, źródło src="", teskst alternatywny alt, width i height="")

TESTY Buttons

(< button )

TESTY Lists

• Kawa
• Herbata
• Mleko

Lub

1. Kawa
2. Herbata
3. Mleko

(< ul/ ol, w tym < li, zamkniecie li i ul/ ol : BO - U-Unordered, O-Ordedered)

TESTY Elements

< tagname > - nazwa tagu, start < / tagname > - nazwa tagu, koniec
np. < h1> content-zawartość < / h1> (np. h1 lub h2 to nagłówek)
< p> contetn-zawartość < / p>
Należy pamiętać o zakańczaniu tagów.( tu też widzimi czym jest element "content")

jest również < br < bez zawartości >
Tzw. pusty element.
Można go zamknąć w sposób taki: < br />

HTML5 nie wymaga zamykania pustych elementów, jednak jeśli chcemy mieć pewność i ścisłość zaleca się zamykać.


Znaczniki HTML nie rozróżniają wielkości liter: < P> oznacza to samo co < p>. Standard HTML5 nie wymaga tagów pisanych małymi literami,
ale W3C zaleca małe litery w HTML i wymaga małych liter dla bardziej rygorystycznych typów dokumentów, takich jak XHTML.

TESTY Attriutes

Często występują w parach np. nazwa ="wartość"
np. href = "link"
czy przy < img src = "ścieżka obrazka/nazwa obrazka. jpg"
,a następnie witdh="wartość" , height="wartość"
lub alt="informacja o obrazku" (dosłownie alternatywna informacja)
ORAZ < p style="color:red">treść< / p>
ORAZ atrybut języka:
< !DOCTYPE html>
< html lang="en-US">
< body>
...
< / body>
< / html>
(en - język, US - dialekt)
ORAZ title
np. < h2 lub < p title="treść"> treść-tekst i zamknięcie np. < / h2> lub < / p>

TESTY Headings

font-size
np. < h1> style="font-size:60px:">Treść< / h1>
Wygląda to tak:

NAGŁÓWEK1

nagłówek1

tekst

nagłówek2

tekst

TESTY Pre-Paragraphs

< pre> - tak jak napiszemy coś w pliku tak bedzie wyświetlać, np.
< pre>
My Bonnie lies over the ocean. My Bonnie lies over the sea. My Bonnie lies over the ocean. Oh, bring back my Bonnie to me.
< / pre> Wygląda tak:

			My Bonnie lies over the ocean.
			
			My Bonnie lies over the sea.
			
			My Bonnie lies over the ocean.
		   
			Oh, bring back my Bonnie to me.
			

TESTY Styles

Normalny styl paragrafu

< style="właściwość:cechha;">Treść paragrafu< / p>,
np. < p style="color:red;">JESTEM CZERWONY< / p> :

JESTEM CZERWONY

lub "font-size:50px;">JESTEM DUŻY :

JESTEM DUŻY

lub "font-sixe:160%;">

Paragraf 160%

czy 300% w nagłówku1

NAGŁÓWEK1 300%

Gdzie "property:value;">
Property to właściwość CSS, a value to wartość CSS.

Teraz tło np. < p (LUB < h> LUB < body style="background-color:powderblue;"> i do tego jakaś treść:

TROLOLOLO

TROLOLOLO2

CZCIONKI

< h4 style="font-family:verdana;">Treść< / h4>
czy
< p style="font-family:courier;">Treść< / p>

Nagłówek4

Paragraf

CENTRALNE WYSUNIĘCIE

< h4 style="text-align:center;">Centralny tytuł< / h4>
< p style="text-align:center;">Napiłbym się soczku< / p>

Centralny tytuł

Napiłbym się soczku

TESTY Formatting

< p>TO JEST NORMALNY TEKST< / p>
< p>< b>TEN TEKST JEST POGRUBIONY< / b>< / p>
< p>< i>TEN TEKST JEST ITALIC< / i>< / p>
< p>TO JEST< sub> PODTEKST< / sub> ORAZ < sup>NADTEKST< / sup>< / p>
< p>< strong>TEN TEKST JEST STRONG< / strong>< / p>
< p>< em>TEN TEKST JEST EMPHASIZED< / em>< / p>
< p>TEN TEKST JEST< del>SKREŚLONY< / del>< / p>
< p>TEN TEKST JEST< mark>ZAMARKEROWANY< / mark>< / p>
< h2>TEN tekst JEST< small>MNIEjszy< / small>< / h2>
< p>TEN TEKST JEST< ins>PODKREŚLONY< / ins>< / p>

TO JEST NORMALNY TEKST

TEN TEKST JEST POGRUBIONY

TEN TEKST JEST ITALIC

TO JEST _PODTEKST ORAZ ^NADTEKST

TEN TEKST JEST STRONG

TEN TEKST JEST EMPHASIZED

TEN TEKST JEST SKREŚLONY

TEN TEKST JEST ZAMARKEROWANY

TEN tekst JEST MNIEjszy

TEN TEKST JEST PODKREŚLONY

TESTY Quotations

< blockquote - robi akapit

< blockquote cite="http://www.worldwildlife.org/who/index.html">...tekst...< / blockquote> wygląda tak:

For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.

< p> Tekst< abbr title="Nazwa">Zaznaczona treść< / abbr>tekst< / p> - PodkropkowanieSkrótu/Tytułu

< p>The< abbr title="World Health Organization">WHO< / abbr>was founded in 1948.< / p>

The WHO was founded in 1948.

Oznaczanie skrótów może dostarczyć przydatnych informacji przeglądarkom, systemom tłumaczeniowym i wyszukiwarkom.

< p>< cite>The Scream< / cite> by Edvard Munch. Painted in 1893.< / p>
The HTML cite element defines the title of a work.Browsers usually display cite elements in italic.

The Scream by Edvard Munch. Painted in 1893.

< bdo dir="rtl">Tekst< / bdo>
If your browser supports bi-directional override (bdo), the next line will be written from right to left (rtl):

TESTY Comments

< !-- KOMENARZ --> - Jest widoczny tylko z poziomu HTML, na stronie nie widoczny

TESTY Color

Kolory Tła

HTML supports 140 standard color names.

Tomato

Orange

DodgerBlue

MediumSeaGreen

Gray

SlateBlue

Violet

LightGray

< h1 style="background-color:DodgerBlue;">Hello World< / h1>
< p style="background-color:Tomato;">Lorem ipsum...< / p>

Hello World

Lorem ipsum...

Kolory Tekstu

< h3 style="color:Tomato;">Hello World< / h3>

Hello World

< p style="color:DodgerBlue;">LoremIpsum...< / p>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

< p style="color:MediumSeaGreen;">Ut wisi enim ad...< / p>

Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Kolory "ramek">

Hello World

Hello World

Hello World

KOLORY

WEDŁUG NAZWA oraz WEDŁUG WARTOŚCI

TESTY Links