Przejdź do treści

Centrum Kształcenia Zawodowego i Ustawicznego w Mrągowie

Atrybuty związane z tabelą

piątek,

Atrybuty związane z tabelą

Znaczniki HTML związane z tabelami mają kilka charakterystycznych dla siebie atrybutów.

AtrybutElementFunkcja
colspanth, tdscalanie komórek w poziomie
rowspanth, tdscalanie komórek w pionie
spancol, colgroupile kolumn zostało przypisanych do elementu
headerstdkojarzy komórkę z id nagłówka
scopethokreśla zasięg elementu, możliwe wartości: col, row, colgroup, rowgroup

We wszystkich przykładach zastosowano te same reguły CSS. Zostały one zamieszczone poniżej.

table{border-collapse: collapse; width: 768px;}
td, th{padding: 5px; border: solid 1px #777; width: 33%;}

Atrybuty colspan i rowspan pozwalają na scalanie komórek w pionie lub w poziomie.

Uczeń Klasa
Kowalski Jan 2TI
Lipny Karol
<table>
	<tr>
		<th colspan="2">Uczeń</th>
		<th>Klasa</th>
	</tr>
	<tr>
		<td>Kowalski</td>
		<td>Jan</td>
		<td rowspan="2">2TI</td>
	</tr>
	<tr>
		<td>Lipny</td>
		<td>Karol</td>
	</tr>
</table>

Atrybut headers służy do kojarzenia komórek danych z komórkami nagłówka w tabelach. Nie daje on żadnych efektów wizualnych w standardowych przeglądarkach. może być wykorzystany przez czytniki ekranu.

Nazwisko Imię Klasa
Kowalski Jan 2TI
Lipny Karol 2TI
<table>
	<tr>
		<th id="nazwisko">Nazwisko</th>
		<th id="imie">Imię</th>
		<th id="klasa">Klasa</th>
	</tr>
	<tr>
		<td headers="nazwisko">Kowalski</td>
		<td headers="imie">Jan</td>
		<td headers="klasa">2TI</td>
	</tr>
	<tr>
		<td headers="nazwisko">Lipny</td>
		<td headers="imie">Karol</td>
		<td headers="klasa">2TI</td>
	</tr>
</table>

Atrybut scope określa, czy nagłówek dotyczy kolumny, wiersza czy grupy kolumn lub wierszy. Nie daje on żadnych efektów wizualnych w standardowych przeglądarkach. może być wykorzystany przez czytniki ekranu.

Imię Klasa
Kowalski Jan 2TI
Lipny Karol 2TI
<table>
	<tr>
		<th></th>
		<th scope="col">Imię</th>
		<th scope="col">Klasa</th>
	</tr>
	<tr>
		<th scope="row">Kowalski</th>
		<td>Jan</td>
		<td>2TI</td>
	</tr>
	<tr>
		<th scope="row">Lipny</th>
		<td>Karol</td>
		<td>2TI</td>
	</tr>
</table>

Atrybut span może być stosowany w znacznikach col i colgroup. Jego funkcja to określenie liczby kolumn, które obejmuje element. W poniższym kodzie nie ma błędu, znacznik col nie wymaga domknięcia.

Nazwisko Imię Klasa
Kowalski Jan 2TI
Lipny Karol 2TI
<table>
	<col span="2">
	<col>
	<tr>
		<th>Nazwisko</th>
		<th>Imię</th>
		<th>Klasa</th>
	</tr>
	<tr>
		<td>Kowalski</td>
		<td>Jan</td>
		<td>2TI</td>
	</tr>
	<tr>
		<td>Lipny</td>
		<td>Karol</td>
		<td>2TI</td>
	</tr>
</table>
Artykuł: Dzień, w którym słońce zaszło w&nbsp;południe

Dzień, w którym słońce zaszło w południe

Artykuł: Konferencja teherańska

Konferencja teherańska

Artykuł: Utworzenie Marynarki Wojennej

Utworzenie Marynarki Wojennej

Artykuł: Dekret o ordynacji wyborczej

Dekret o ordynacji wyborczej

Artykuł: Arm Holdings

Arm Holdings

Artykuł: Podstawowe style CSS dla formularza

Podstawowe style CSS dla formularza

Nasze technikum

Szkoły dla dorosłych

Pełna oferta edukacyjna