abc HTML5 i CSS TUTORIAL

Primjeri: 2.3. Horizontalni navigacioni linkovi - vrh /HORIZONTAL NAVIGATION LINKS/
INLINE-BLOCK

Primjer 3. Horizontalni navigacioni linkovi /HORIZONTAL NAVIGATION LINKS/ iznad teksta. Veličina fonta je standardna.
Opis: li - definiše se boja pozadine parametrom: background-color: orange; te je cijeli red obojen ovom bojom. (vidi primjer 3.)
display: inline-block; svi elementi LI će biti istom redu.

<!DOCTYPE html>
<html>
<head><title>INLINE-BLOCK - EXCAMPLES</title>
<style>
.nav {
  list-style-type: none;
  text-align: center;
  margin: 0;
  padding: 0;
}
.nav li {
  display: inline-block;
  background-color: orange;
  font-size: 1em;
  padding: 10px;
}
</style>
</head>
<body>
<h2>Horizontalni navigacioni linkovi - vrh</h2>
<ul class="nav">
  <li><a href="#home">Home</a></li>
  <li><a href="#oNama">O nama</a></li>
  <li><a href="#poglavlje1">Poglavlje 1</a></li>
  <li><a href="#poglavlje2">Poglavlje 2</a></li>
</ul>
<p>Na vrhu teksta se nalazi red sa navigacionim linovima.</p>
<p>Napomena: Ako smanjite veličinu prozora da nema prostora za ispis svih linkova po automaitizmu BROWSER će ispisati u slijedećem redu preostale linkove</p>
</body>
</html>

Horizontalni navigacioni linkovi - vrh

Na vrhu teksta se nalazi red sa navigacionim linovima.

Napomena: Ako smanjite veličinu prozora da nema prostora za ispis svih linkova po automaitizmu BROWSER će ispisati u slijedećem redu preostale linkove

Spisak .css fajlova /CSS FILES LIST/

Prozor na dnu stranice je namjenje za provjeru koda:
- kopirajte kod (edit, copy, paste ili CTRL+C, CTRL+V ili DRAG&DROP metodom), editovanje je moguće u prozoru

Index