Jednoduchý spôsob , ako vytvoriť menu s potrhaný papier v CSS

Tvorba roztrhané ponuku papiera v CSS je ľahké to urobiť tým , že najprv vytvoria potrhaný papier obraz a potom sa pridá obrázok do CSS kódu . Pomocou týchto základných krokov k vytvoreniu roztrhnutý papier v grafickom softvéri , ktorý obsahuje vrstvy a efekty . Natívne softvér , ako je napríklad Maľovanie , nebude môcť vytvoriť efekt sám o sebe , ale môže sa upgrade zdarma prostredníctvom Paint.NET . Ďalší softvér , ako SnagIt , prichádza s roztrhané papierové efekt . Návod
potrhaný papier obrázok
1

Otvorte svoj ​​obľúbený grafický softvér , ako Paint.NET , gimp alebo Photoshop .
2

Vytvoriť nový súbor , ktorý predstavuje veľkosť menu . Pridajte novú vrstvu na vrchole . Vyplňte vrstvu s bielou a potom skryť vrstvu . Pridať priehľadnú vrstvu , v hornej časti bielou vrstvou .
3

Vyberte štetec a vytvoriť nerovné čiaru cez bielou vrstvou . Zlúčenie priehľadné a biele vrstvy a potom duplikovať .
4

Pridať Gaussova rozostrenie na druhú vrstvu . Kliknite na hornej vrstve a potom kliknite na oblasti , ktoré majú byť zobrazené cez roztrhané papierové efektu s kúzelnou paličkou nástroja . Invertovať výber a potom odstrániť .
5

Zlúčiť dve horné vrstvy a kliknite na oblasti , ktoré majú byť zobrazené s čarovným nástrojom . Odstrániť výber .
6

Uložte snímku ako nový súbor PNG .
7

Vytvorte novú vrstvu a pridať text do obrázka , ako je " Home " . Uložte súbor s novým názvom ako doma a opakujte podľa potreby v ďalších záložkách menu .
HTML súborov
8

Otvorte svoj ​​súbor HTML a pridajte nasledujúci CSS kód do sekcie head kódu .

"