• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Wydzielenie konkretnej części z obrazu i nadanie bordera + manipulacja obiektem

VPS Starter Arubacloud
0 głosów
148 wizyt
pytanie zadane 8 września 2016 w HTML i CSS przez KubVard Użytkownik (510 p.)
Witam,

Mam taki problem, że chciałbym z obrazu wyciąć konkretną postać i ostylować ją. Ta "postać" znajdowałaby się nadal w tym samym miejscu obrazu na stronie, ale chciałbym nadać jej border, hover, który ją powiększy i zmieni kolor tła i akcje on-click.

W Gimpie wyciąłem tę postać, zrobiłem transparent background, zapisałem jako .png (.gif też) po czym starałem się wstawić ją do HTMLa i nadać border. Niestety, border obrysowuje mi pierwotne ramy oryginalnego zdjęcia a nie wycięty content. Próbowałem już na kilka sposobów i dowiedziałem się, że właściwość border w taki sposób nie zadziała. W takim razie, jak mogę uzyskać taki efekt i manipulować takim wyciętym obiektem?

1 odpowiedź

0 głosów
odpowiedź 8 września 2016 przez GrubaPanda Gaduła (3,920 p.)

Mógłbyś użyć czegoś w stylu: 

 -webkit-filter: drop-shadow(1px 1px 0 black) drop-shadow(-1px -1px 0 black);
    filter:drop-shadow(1px 1px 0 black) drop-shadow(-1px -1px 0 black);

Dla twojego obrazu w PNG. Jednakże kompatybilność tego rozwiązanie nie jest 100% z przeglądarkami http://caniuse.com/#feat=css-filters 

komentarz 8 września 2016 przez KubVard Użytkownik (510 p.)
To dobry pomysł, żeby dodać border. Działa.

Ale nadal nie potrafię znaleźć rozwiązania dzięki któremu, gdy najadę myszką TYLKO na wycięty kształt (bo linia cięcia postaci nie jest boxem), to zmieniają się właściwości. CSS traktuje wyciętą postać z transparentnym tłem zawsze jako czworokąt, którego granica znajduje się tam, gdzie są najbardziej wysunięte "części" postaci.

Podobne pytania

0 głosów
3 odpowiedzi 185 wizyt
pytanie zadane 11 sierpnia 2016 w Systemy operacyjne, programy przez gab123 Mądrala (5,230 p.)
0 głosów
1 odpowiedź 203 wizyt
pytanie zadane 28 marca 2016 w Systemy operacyjne, programy przez Avernis Nałogowiec (27,400 p.)
0 głosów
2 odpowiedzi 1,069 wizyt
pytanie zadane 29 września 2020 w Grafika i multimedia przez Amunius Początkujący (280 p.)

92,451 zapytań

141,261 odpowiedzi

319,073 komentarzy

61,853 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...