Gobernantza, Administrazio Digital eta Autogobernu Saila

Euskadi.eus berriaren estilo komunak

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.