Ciekawe kształty w czystym CSS
Na stronie internetowej czasem potrzebujemy wyświetlić niestandardowy kształt. Tu możemy wykorzystać CSS i właściwość border-radius.
Łukasz
Podziel się artykułem:
Na stronie internetowej czasem potrzebujemy wyświetlić niestandardowy kształt. Tu możemy wykorzystać CSS i właściwość border-radius.
Przejdźmy zatem do kodu, jaki pozwoli nam uzyskać powyższy efekt:
.fancy-border {
width: 50%;
height: 150px;
border-radius: 26% 74% 85% 15% / 19% 65% 35% 81%;
background: #ff0022;
filter: drop-shadow(0 0 0.75rem rgba(0, 0, 0, 0.5));
display: block;
margin: 0 auto;
}Przeczytaj także
CSS Container Queries już działa!
Container Queries już działa! Zapowiedzi potwierdziły się i mamy już możliwość korzystania z tego rozwiązania w najnowszych, stabilnych wersjach przeglądarek.
Kolory LCH to przyszłość w CSS?
Jednostki LCH są to nowe jednostki kolorów CSS, które są częścią specyfikacji CSS Color Level 4. Dają one dużo większe możliwości niż np. HEX czy RGB.
Nowa składnia media query w CSS
Budowanie nowoczesnego designu strony powinno być oparte o poprawne wypełnienie ekranu treścią i przedstawienie jej w efektowny sposób. Z pomocą przychodzi nam tutaj technika zwana @media query.