Kako stvoriti lažne Screenshots web stranica s Firebugom

Kad pomislite na lažne ili uređene snimke zaslona, ​​programi poput Photoshopa vjerojatno vam padaju na pamet. Nikada nisam bio vrlo kreativan kada je riječ o dizajnu i grafičkim radovima, tako da to za mene gotovo i ne dolazi u obzir. Ako pokušavate zamijeniti lica na slici, morat ćete naučiti kako se takvi programi koriste. Ako pokušavate učiniti nešto poput promjene teksta u razgovoru na Facebooku, nema potrebe. Sve što trebate je Firebug i PrtScrn tipka.

Firebug je dostupan za svaki glavni preglednik Kako instalirati Firebug na IE, Safari, Chrome i Opera Kako instalirati Firebug na IE, Safari, Chrome i Opera: IE6 +, Firefox, Opera, Safari i Chrome. U ovom primjeru, provest ću vas kroz tutorial o tome kako ga koristiti za svoj izvorni preglednik, Firefox. Što je Firebug? Firebug je dodatak za preglednik koji vam omogućuje uređivanje, uklanjanje pogrešaka i nadgledanje CSS-a. Sljedeći koraci na putu da postanete CSS Jedi majstor Sljedeći koraci na putu da postanete CSS Jedi Master CSS apsolutno je jedan od najvažnijih tehnologija koje se danas koriste na Internetu i dok većina ljudi prizna da poznaje malo HTML-a, o CSS-u općenito ne znamo. Zadnji put sam vam predstavio ..., HTML i JavaScript. Da biste manipulirali web stranicama, kao što ću vam danas pokazati, nećete trebati znati nijedan od tih jezika.

Instaliranje Firebuga

Instalacija je nevjerojatno jednostavna. Prijeđite na službenu web stranicu kako biste preuzeli dodatak [Više nije dostupno]. Odatle odaberite svoj preglednik (poželjno je Firefox, tako da je lakše slijediti dalje). Instalirajte dodatak i po potrebi ponovno pokrenite preglednik.

Korištenje Firebuga

Kada instalirate Firebug, zadano bi se ikona trebala prikazati na vašoj dodatnoj traci, izborniku Alati i eventualno kontekstnom izborniku. Kliknite ikonu na traci dodataka i vidjet ćete novu karticu na dnu zaslona.

Ono što ovdje vidite je HTML prikaz elemenata web stranice na kojoj se nalazite. U ovom primjeru to je stranica za preuzimanje Firebuga na Firefox dodacima [Nema više dostupnih]. Ako vas zanima upotreba Firebuga u uobičajenije svrhe, slobodno se poturajte po karticama i osjetite njegove značajke.

Gumb koji sam istaknuo na toj snimci zaslona je alat za pregled. Ovo je alat koji ćemo koristiti. Kliknite taj gumb i tada ćete primijetiti da će svako područje teksta iznad kojeg pokažite pokazivač biti označeno u prikazu web stranice, a zatim označeno dolje u Firebug-ovom HTML prikazu.

Promjena teksta

Kliknite na blok teksta kojim želite manipulirati. Vidjet ćete da je tekst odabran u HTML prikazu Firebuga. Od tamo dvaput kliknite liniju HTML-a koja uključuje tekst koji želite promijeniti. Možete početi upisivati ​​što god želite.

Dok kucate, vidjet ćete da su ažuriranja za pregled uživo na web stranici.

Kul, zar ne? To je posebno jednostavno zbog načina na koji vam Firebug omogućuje izoliranje neobrađenog teksta od zamotanog HTML-a. Na taj način su sačuvani svi HTML elementi, CSS stilovi i ostali važni vizualni sadržaji tako da izgledaju kao prava kopija.

Kako vam je Firebug ugodniji ili ako već znate HTML, lako ćete promijeniti ostale elemente na stranici, poput slika. Mogućnosti su prilično beskrajne i siguran sam da već osmišljavate načine na koje možete koristiti i zloupotrijebiti ovaj mali trik.

Javite mi što mislite o ovom malom savjetu i podijelite svoje kreativne načine na koji ćete ga koristiti u komentarima!