The Blog

By / Egzamin E.14Egzamin EE.09HTML

HTML: listy.

Listy

Listy występują również w języku HTML. Są one wykorzystywane między innymi, poza oczywistym wypisywaniem treści w liście, czy do tworzenia menu nawigacyjnego służącego do poruszania się po stronie. Listy dzielimy na dwa rodzaje: listę posortowaną <ol> oraz listę nieposortowaną <ul>,
a elementy listy definiujemy za pomocą znacznika <li>.

Przykład list posortowanych i nieposortowanych:

<!DOCTYPE html>
<html>
(...)
  <body>
		<h1>Listy</h1>
		<h2>Lista posortowana</h2>
		<ol>
  			<li>Element listy</li>
  			<li>Element listy</li>
  			<li>Element listy</li>
		</ol>
		<h2>Lista nieposortowana</h2>
		<ul>
  			<li>Element listy</li>
  			<li>Element listy</li>
  			<li>Element listy</li>
		</ul>
  </body>
</html>

W listach <ol>, sposób wyświetlania możemy modyfikować za pomocą atrybutu type. Wartość, od której się zaczynają, definiujemy za pomocą atrybutu value. Listy można zagnieżdżać.

Modyfikacje sposobu wyświetlania list posortowanych:

<ol>
  	<li value="5">Element listy</li>
  	<li>Element listy</li>
  	<li>Element listy</li>
</ol>

<ol type="A">
  	<li>Element listy</li>
  	<li>Element listy</li>
  	<li>Element listy</li>
</ol>

<ol type="a">
  	<li>Element listy</li>
  	<li>Element listy</li>
  	<li>Element listy</li>
</ol>

<ol type="I">
  	<li>Element listy</li>
  	<li>Element listy</li>
  	<li>Element listy</li>
</ol>

<ol type="i">
  	<li>Element listy</li>
  	<li>Element listy</li>
  	<li>Element listy</li>
</ol>

Zagnieżdżanie list:

	<ol type="I">
		<li>Element listy:
		<ol type="i">
		<li>Element listy</li>
		<li>Element listy</li>
		<li>Element listy</li>
		</ol></li>
		<li>Element listy</li>
		<li>Element listy</li>
	</ol>

Autor tekstu: Jacek Woźniak

kompendiumEE09

Jestem projektem wykonanym przez czwórkę znajomych mających podobne zainteresowania. Możesz znaleźć wszystkie materiały z zakresu E14 na stronie: http://danda.e-kei.pl/jacek/kompendiumEE_IX/