Euskadi.eus berriaren CSSetan hainbat estilo komunak ezarri dira "class"-en bidez. Estilo komun horiek erabiltzeko, erabili kode hau HTMLan:

class="estiloaren_izena"

Gogoratu "class" hauek elkarrekin erabil daitezkeela (adibidez, <span> baten barruan dagoen testua letra etzanean eta lodian jarri classak gehituz:

class="letra_etzana letra_lodia_600"

Estilo horiek edozein eduki zein orrialdean erabil daitezke, Euskadi.eus-eko elementu komunen itxura aldatu gabe (hau da, aurrezarritako moduluen zein edukien itxura). Edozein zalantza izanez gero jar zaitez harremanetan Web Zerbitzuarekin.

Elementuen ikusgaitasuna kudeatzeko class-ak

.inv

Elementua pantailan ezkutatzera behartzeko (pantaila guztietan). Erabilerraztasunari begira, elementua eskuragarri egongo da pantaila irakurleentzat

.hidden

Elementua pantailan ezkutatzera behartzeko (pantaila guztietan). Erabilerraztasunari begira, elementua ez da eskuragarri egongo pantaila irakurleentzat

.inv_screen

Elementua pantaila handietan ezkutatzera behartzeko

.ikus_screen

Elementua pantaila handietan erakustera behartzeko

.inv_mugik

Elementua pantaila txikietan ezkutatzera behartzeko

.ikus_mugik

Elementua pantaila txikietan erakustera behartzeko

.inv_print

Elementua inprimatzeko bertsioan ezkutatzera behartzeko

.ikus_print

Elementua inprimatzeko bertsioan erakustera behartzeko

Elementuen itxura ezartzeko estiloak

.borobil

Elementuari borobil itxura emateko (hau da, ertz borobilak emateko)

.taula_orokorra

Taulei formatoa emateko eta mugikorretan scroll barrak erakusteko

.botoiak

Estekei eta input elementuei botoi itxura emateko

Estekak zerrenda batean

UL etiketari "botoiak" klasea emango diogu:

<ul class="botoiak">
<li><a href="/eusko-jaurlaritza/-/ezagutu-eusko-jaurlaritza#9164">Pertsonak</a></li>
<li><a href="/eusko-jaurlaritza/-/ezagutu-eusko-jaurlaritza#1728">Sistema politikoa</a></li>
</ul>
    

Esteka bakarra denean, esteka duen edukiontziari (p, div, eta abar) "botoiak" klasea emango diogu:

<div class="botoiak">
<a href="/eusko-jaurlaritza/-/ezagutu-eusko-jaurlaritza#9164">Pertsonak</a>
</div>
    

Formulario baten submit elementuan, submit duen edukiontziari "botoiak" klasea emango diogu:

<div class="botoiak">
<input type="submit" value="Bilatu" id="bilaketa" />
</div>
    

.alert-info

Atzeko kolore urdina duen blokea sortzen du

.center-block

Bloke elementu bat erdira ekartzen du (ez testua, blokea baizik)

.margin_top_2 / .margin_top_4 / .margin_top_8

Elementua bloke bezala erakusten du eta goian 2em (edo 4em, edo 8em) tamainako marjina sortzen du

.margin_right_2 / .margin_right_4 / .margin_right_8

Elementua bloke bezala erakusten du eta eskuman 2em (edo 4em, edo 8em) tamainako marjina sortzen du

.margin_bottom_2 / .margin_bottom_4 / .margin_bottom_8

Elementua bloke bezala erakusten du eta behean 2em (edo 4em, edo 8em) tamainako marjina sortzen du

.margin_left_2 / .margin_left_4 / .margin_left_8

Elementua bloke bezala erakusten du eta ezkerrean 2em (edo 4em, edo 8em) tamainako marjina sortzen du

Tipografia eta koloreak

.kontuz

Testu kolore gorrian jartzeko (#ff0000)

.kontuz

Testu kolore gorrian jartzeko (#ff0000)

.editatu

Testua kolore berdean jartzeko (#669900)

.urdina

Testua kolore urdinean jartzeko (esteken kolore estandarra)

.testu_arrunta

Testua kolore beltzean jartzeko (testuaren kolore estandarra)

.testu_etzana

Testua modu etzanean jartzeko

.testu_lodia_600

Testua letra lodian jartzeko (600)

.testu_lodia_700

Testua letra lodian jartzeko (700, aurrekoa baino lodiago)

.testu_azpimarra

Testua azpimarratzeko

.r01AlignLeft

Testua ezkerrera lerrokatzeko

.r01AlignRight:

Testua eskumara lerrokatzeko

.r01AlignCenter

Testua erdian jartzeko

.r01AlignJustify

Testua justifikatzeko

.text-lowercase

Testua letra minuskuletan erakusten du

.text-uppercase

Testua letra maiuskuletan erakusten du

Estilo edota beharraren orokor bat ikusten baduzu jarri zaitez harremanetan zeure Web Kudeatzailearekin.