Veturia box-shadow

Veturia box-shadow i cakton hije një blloku. Si vlerë, veturia pranon 6 parametra, të listuar përmes hapësirës, ose fjalën kyçe none, e cila e çaktivizon hijen krejtësisht.

Sintaksa

përzgjedhës {
	box-shadow: inset zhvendosje_përgjatë_x zhvendosje_përgjatë_y zamrimë madhësi_hije ngjyrë;
}

përzgjedhës {
	box-shadow: none;
}

Parametrat

Parametri	Përshkrimi
`inset`	Parametër jo i detyrueshëm. Nëse është caktuar, hijea do të jetë brenda enës, nëse nuk është caktuar - atëherë jashtë.
zhvendosje përgjatë x	Cakton zhvendosjen e hijes përgjatë boshtit X. Vlera pozitive e zhvendos djathtas, vlera negative - majtas.
zhvendosje përgjatë y	Cakton zhvendosjen e hijes përgjatë boshtit Y. Vlera pozitive e zhvendos poshtë, vlera negative - lart.
zamrimë	Cakton zamrimin e hijes. Sa më e madhe të jetë vlera - aq më e zamuar do të jetë hijea. Parametër jo i detyrueshëm. Nëse nuk është caktuar - hijea do të jetë e qartë.
madhësi hije	Cakton madhësinë e hijes. Vlera pozitive e shtrin hijen, vlera negative, përkundrazi, e ngjesh atë. Parametër jo i detyrueshëm. Nëse nuk është caktuar - hijea do të jetë e së njëjtës madhësi si elementi.
ngjyrë	Cakton ngjyrën e hijes në çdo njësi për ngjyrë. Parametër jo i detyrueshëm. Nëse nuk është caktuar - ngjyra e hijes përputhet me ngjyrën e tekstit.

Zhvendosjet përgjatë boshteve, zamrimi dhe madhësia e hijes caktohen në çdo njësi për madhësi, përveç përqindjeve.

Shembull

Në këtë shembull, hijea është zhvendosur poshtë dhe djathtas dhe është shtuar zamrimë e vogël:

<div id="elem"></div>

#elem {
	box-shadow: 5px 5px 3px black;
	border: 1px solid black;
	width: 300px;
	height: 50px;
}

Shembull . Hije e qartë

Në këtë shembull, hijea është zhvendosur poshtë dhe djathtas, por nuk ka zamrimë (hija do të jetë e qartë):

<div id="elem"></div>

#elem {
	box-shadow: 2px 2px black;
	border: 1px solid black;
	width: 300px;
	height: 50px;
}

Shembull . Hije uniforme

Në këtë shembull, hijea nuk është zhvendosur, por asaj i është shtuar zamrimë:

<div id="elem"></div>

#elem {
	box-shadow: 0px 0px 3px black;
	border: 1px solid black;
	width: 300px;
	height: 50px;
}

Shembull . Madhësia e hijes

Në këtë shembull, hijea nuk është zhvendosur, zamrimi është zero, por asaj i është shtuar madhësi (e zeza është kufiri, e kuqja - është hijea):

<div id="elem"></div>

#elem {
	box-shadow: 0 0 0 3px red;
	border: 3px solid black;
	width: 300px;
	height: 50px;
}

Shembull . Zamrimë + madhësi hije

Në këtë shembull, hijea nuk është zhvendosur, por asaj janë shtuar zamrimë dhe madhësi (e zeza është kufiri, e kuqja - është hijea):

<div id="elem"></div>

#elem {
	box-shadow: 0 0 3px 3px black;
	border: 1px solid black;
	width: 300px;
	height: 50px;
}

Shembull . Hije e brendshme

Në këtë shembull, hijea ndodhet brenda enës:

<div id="elem"></div>

#elem {
	box-shadow: inset 0 0 6px black;
	border: 1px solid black;
	width: 300px;
	height: 50px;
}

Shihni gjithashtu

veturia text-shadow,
e cila i cakton hije tekstit