Element <span>

Pojemnik, na pierwszy rzut oka podobny do <div>, jednak w odróżnieniu od niego, element <span> nie zachowuje się blokowo (nie spowoduje zmian w strukturze blokowej witryny, niczego nie przesunie). Słowo span ma w języku angielski wiele znaczeń, jednak w tym kontekście przetłumaczymy je jako: zasięg, rozpiętość. Najczęściej element <span> tworzymy po to, aby zdefiniować zasięg działania jakiejś klasy w CSS.

Sam znacznik nie posiada żadnej roli, poza właśnie prostym zdefiniowaniem iż odtąd dotąd obowiązuje dany styl. Dlatego też atrybutami znacznika <span> będą najczęściej class, albo ewentualnie <style>. Dobrym praktycznym przykładem zastosowania <span>, jest chęć zapisania jednego wyrazu innym kolorem czcionki, na przykład czerwonym:

 <style> .cz { color:red; } </style>
<!-- ustawienie czerwonego koloru czcionki dla klasy .cz -->

Polowanie na <span class="cz">Czerwony</span> Październik

Rezultat w przeglądarce:

Polowanie na Czerwony Październik

Takie użycie <span> zastąpiło nieużywane już dzisiaj tagi <font> z atrybutem color. Tagów <font> nie używamy, gdyż interesuje nas rozdzielenie wyglądu strony od jej zawartości.

Czasami, w niektórych kodach źródłowych, zobaczysz elementy <span>, które zachowują się blokowo, tzn. tak jak divy. Jest to możliwe, jeśli w klasie spana wymusimy takie zachowanie dopisując: display: block; Więcej informacji dotyczących elementu span znajdziesz w tym miejscu.

Zobacz także

Daj się zaskoczyć! Poniżej wylosowałem dla Ciebie pięć wpisów z innych kategorii blogowych aniżeli ta, którą właśnie przeglądasz:

Książka: Wprowadzenie do bezpieczeństwa IT

Wprowadzenie do bezpieczeństwa IT

Niedawno wystartował dodruk świetnej, rozchwytywanej książki pt. "Wprowadzenie do bezpieczeństwa IT, Tom I" (około 940 stron). Mamy dla Was kod: pasja (wpisz go w koszyku), dzięki któremu otrzymacie 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla naszych Widzów! Jest to pierwszy tom serii o ITsec, który wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

Pomóż dzieciom

Polska Akcja Humanitarna od wielu lat dożywia dzieci. Proszę, poświęć teraz dosłownie chwilę i pomóż klikając w oznaczony strzałką zielony brzuszek Pajacyka. Dziękuję!

Komentarze

Czy macie jakieś pytania, sugestie, uwagi? A może zauważyliście literówkę albo błąd? Dajcie koniecznie znać: kontakt@pasja-informatyki.pl. Dziękujemy za poświęcony czas - to dzięki Wam serwis staje się coraz lepszy!

Kategorie wpisów

Oto polecana książka warta Waszej uwagi.
Pełna lista polecanych książek jest tutaj.

W dniach od 13.06.2024 do 17.06.2024 trwa w Videopoint.pl promocja urodzinowa - oprócz wielu zniżek mamy też możliwość odebrania darmowego kursu! Można odebrać jeden videokurs z trzech: 1. "Mały szachista"; 2. "Wejście w świat IT"; 3. "Angielski dla inżynierów i techników". Warto korzystać - Zobacz promocję na 9 urodziny Videopoint.pl

Bądź na bieżąco
Pasja informatyki