Mala šola CSS VIII.: Oblikovanje naslovov

CSS_sola_image

Značke za naslove H1, H2, H3, … so zelo pomembne za optimizacijo spletnih strani (SEO). Ponavadi pa so takšni naslovi dolgočasni in ne zanimivi. Tu nam pride prav CSS, s katerim lahko naslove malo začinimo.

Najprej je potrebno določiti klasične parametre znački za naslove, potem pa bomo dodali še dodatne značke v sam naslov. Slednje nam bodo omogočale, da celoten naslov, ki je v znački dodatno izboljšamo. V našem primeru bodo uporabljene značke SPAN in SMALL.

CSS-sola_headingi_klasik
Primer klasičnega naslova

CSS-sola_headingi_napredni
Primer naprednejšega naslova z uporabo dodatnih značk

 
Primer CSS kode za naprednejše oblikovanje

h1 {
font-family:"Times New Roman", Times, serif;
font-size:36px;
font-weight:normal;
color:#000000;
}

h1 span {
font-weight:bold;
color:#FF9900;
}

h1 small {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
text-transform:uppercase;
color:#999999;
display:block; /*postavi besedilo v novo vrsto*/
}

Primer HTML značke
<h1><span>Pomagalnik</span> za digitalne medije <small>CSS programiranje</small></h1>

Komentiraj


*