„Soft CSS Box Shadow“ – 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, iš anksto įkeltas švelniu šešėliu: nėra horizontalaus poslinkio, 8 pikseliai žemyn, gausus 24 pikselių suliejimas ir mažas 12 % juodas neskaidrumas. Peržiūros kortelė ją pateikia iš karto – pastumkite bet kurį slankiklį ir CSS eilutė seka realiuoju laiku.
Minkšti šešėliai yra šiuolaikinių sąsajų arkliukas. Didelis suliejimas kartu su mažu nepermatomumu pakelia kortelę nuo puslapio nenubrėžiant griežtų kontūrų, todėl dauguma dizaino sistemų išlaiko aukščio šešėlius būtent šiame diapazone, o ne tankius, tamsius ankstyvojo plokščio dizaino šešėlius.
Nukopijuokite langelio šešėlio liniją tiesiai į savo stiliaus lapą arba sudėkite dar tris sluoksnius, kad vaizdas būtų turtingesnis. Generatorius veikia tik jūsų naršyklėje – niekur nieko neįkelta.