Inset CSS Box Shadow — pripravljena koda
Vizualno sestavite kodo okvirjev CSS: drsniki za odmik, zamegljenost, širjenje, barvo z motnostjo, način vstavljanja in do štiri plasti s predogledom v živo.
Rezultat
Ta stran odpre generator sence polja z že potrjenim potrditvenim poljem za vstavljanje, tako da je senca narisana znotraj elementa namesto za njim. Kartica za predogled naenkrat prikaže potopljeni učinek in vsak drsnik sproti posodablja vrstico CSS.
Vstavljene sence so način, na katerega CSS ponaredi globino, ki gre navznoter: stanja pritisnjenih gumbov, iskalna polja in vdolbinice za vnos, korita za vrstico napredka in vgravirane plošče so odvisne od njih. Ker senca objame notranji rob, se zamegljenost in širjenje obnašata nekoliko drugače kot v običajni senci – drsniki vam omogočajo, da to razliko občutite takoj.
Ko je ugreznjeni videz pravilen, kopirajte črto sence polja v vašo datoteko slogov. Vstavljeno plast lahko kombinirate tudi z običajnimi zunanjimi plastmi – dodajte drugo plast in počistite kljukico vstavljene na njej, da oboje zmešate v eni deklaraciji.