Technologia informacyjna - ćwiczenia 7

Elementy HTML

Kontenery

div

div jest kontenerem blokowym, mogącym przechowywać dowolne inne elementy HTML.

span

span jest kontenerem wierszowym, który wyróżnia część tekstu (lub innych elementów HTML), umożliwiając zastosowanie odrębnego stylu do wyróżnionego fragmentu (np. poprzez nadanie mu klasy).

Paragrafy

Tekst na stronie zwykle podzielony jest na paragrafy. Paragraf zaczyna się tagiem <p>, a kończy tagiem </p>. Każdemu paragrafowi możemy nadać inny styl, np. poprzez przypisanie mu klasy.

Tabele

Tabela w założeniu służy do prezentacji danych w czytelnej dla człowieka formie tabelarycznej. Jest ona jednak często używana również do rozkładania elementów strony (choć zdecydowanie zalecane jest korzystanie w tym celu z kontenerów).

Tabela zawiera następujące znaczniki:

• table - ogranicza całą tabelę
• tr - definiuje wiersz tabeli (table row)
• td - definiuje komórkę z danymi (table data)

Elementy CSS

Czcionka

Czcionki w CSS definiowane są za pomocą następujących elementów:

• font-family - określa krój czcionki
• font-size - określa rozmiar czcionki
• font-weight - określa stopień pogrubienia czcionki
• font-style - określa dodatkowy styl czcionki (np. pochylenie)

body {
	font-family: "Lucida Grande", Sans-Serif;
	font-size: 10pt;
	font-weight: normal;
	font-style: italic;
}

Pozycja

• float - dany kontener będzie kontenerem "pływającym" po zadanej stronie kontenera nadrzędnego
• display - określa styl wyświetlania danego elementu (np. niewidoczny, blokowy, wierszowy, jak tabela)

Ramka

Można określić od razu całą ramkę lub każdy z jej boków osobno. Możliwe jest ustalanie ramki tylko na niektórych bokach elementu.

.element_menu {
	border: 1px dotted red;
}

#kontener_menu {
	border-left: 0px;
	border-top: 0px;
	border-bottom: 0px;
	border-right: 2px solid #c0c0c0;		
}

Z POWROTEM NA POCZĄTEK