Įterptas CSS dėžutės šešėlis – paruoštas kodas
Sukurkite CSS laukelio šešėlio kodą vizualiai: slankikliai, skirti poslinkiui, suliejimui, sklaidai, spalvai su neskaidrumu, įterpimo režimu ir iki keturių sluoksnių su tiesiogine peržiūra.
Rezultatas
Šiame puslapyje atidaromas langelio šešėlių generatorius su jau pažymėtu žymimuoju langeliu, todėl šešėlis nupieštas elemento viduje, o ne už jo. Peržiūros kortelėje iš karto rodomas paskendęs efektas, o kiekvienas slankiklis nuolat atnaujina CSS eilutę.
Įterpti šešėliai yra tai, kaip CSS padirbinėja gylį į vidų: paspaustų mygtukų būsenos, paieškos laukai ir įvesties šuliniai, eigos juostos lovos ir graviruotos plokštės priklauso nuo jų. Kadangi šešėlis apgaubia vidinį kraštą, susilieja ir sklinda šiek tiek kitaip nei įprastame šešėlyje – čia esantys slankikliai leidžia pajusti skirtumą iš karto.
Kai nuskendęs vaizdas bus tinkamas, nukopijuokite langelio šešėlio liniją į savo stiliaus lapą. Taip pat galite sujungti įterptinį sluoksnį su įprastais išoriniais sluoksniais – pridėkite antrą sluoksnį ir panaikinkite jo žymėjimą, kad abu būtų sumaišyti vienoje deklaracijoje.