Kako brzo otvoriti kod stranice u pregledniku, čak i ako je kopiranje zabranjeno. Raspakiranje i dekodiranje JavaScript skripti Kako dešifrirati html kod stranice

Ovaj je članak dodatak članku o demaskiranju skripte. Ovdje će se raspravljati o osnovnim principima enkripcije i pakiranja. slabe točke zaštite, metode ručnog uklanjanja, kao i univerzalne alate za automatsko uklanjanje pakera i zaštite privitaka iz JavaScript skripti. U posljednje vrijeme sve češće izvor skripte su šifrirane ili pakirane. Yandex, DLE i drugi popularni projekti počeli su se zanositi ovim, a lijepe priče o "brizi o korisnicima", "uštedi prometa" i drugim glupostima izgledaju vrlo smiješno. Pa ako netko ima nešto za skrivati, onda je naš zadatak iznijeti ih na vidjelo.

Počnimo s teorijom. Zbog osobitosti izvršavanja JavaScripta, svi kriptori i pakeri, unatoč svojoj raznolikosti, imaju samo dvije varijante algoritma: ili alternativno: Druga metoda se najčešće koristi za zaštitu izvornog html koda stranice, kao i raznih trojanaca za ubacivanje zlonamjernog koda na stranicu, na primjer skriveni okvir. Oba algoritma mogu se kombinirati, "sofisticiranost" i složenost dekriptora može biti bilo što, samo princip ostaje nepromijenjen.

U oba slučaja ispada da funkcije eval() I document.write() Prenose se potpuno dešifrirani podaci. Kako ih presresti? Pokušajte zamijeniti eval() na upozorenje(), au otvorenom MessageBoxu odmah ćete vidjeti dešifrirani tekst Neki preglednici omogućuju kopiranje teksta iz MessageBoxa, ali bolje je koristiti ovaj poluautomatski dekoder:

  1. < html >
  2. < head >< title >JavaScript dekoder
  3. < body >
  4. < script type = "text/javascript" >
  5. // Funkcija za upisivanje rezultata dešifriranja u dnevnik
  6. dekoder funkcije (str) (
  7. dokument. getElementById("dekodirano"). vrijednost += str + "\n" ;
  8. < textarea id = "decoded" style = "width:900px; height:500px;" >
  9. < script type = "text/javascript" >

Na primjer, uzmimo neku skriptu iz Yandexa; nakon što pogledamo izvorni kod, vidimo nešto nezdravo:

Eval(funkcija(p,a,c,k,e,r)(e=funkcija(c)(return(c) c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36)));if(!
"".replace(/^/,String))(while(c--)r=k[c]||e(c);k=)];e=function())(return"\w+") ; c=1);while(c--)if(k[c])
p=p.replace(new RegExp("\b"+e(c)+"\b","g"),k[c]);return p)("$.1e
.18=8(j)(3 k=j["6-9"]||"#6-9";3 l=j["6-L"]||".u-L";3 m=j ["6-L-17"]
||"";3 n=j["1d"]||0;$(5).2(".6-9").14("7");$(5).2(".6 -9").Z("7",8(
)(3 a=$(5).x();3 o=$(5).x();3 h=$(5).B("C");$(5).v("g -4");$(5).16(
$(k).q());3 t=$(o).2("15");3 c=$(o).2(".b-r");3 d=$(o).2 (".b-12");
[ostale iste gluposti su prekinute]

Odmah ću reći da ovu skriptu obrađuje JavaScript Compressor, lako ju je prepoznati po potpisu - karakterističnom nazivu funkcije na početku skripte. Kopirajte cijeli izvorni tekst skripte, zamijenite prvi eval na dekoder, zalijepite ga u dekoder i spremite kao html stranicu. Otvorite ga u bilo kojem pregledniku i vidite da se raspakirana skripta odmah pojavljuje u tekstualnom području. Prerano je za veselje; svi prijelomi redaka i oblikovanje koda su uklonjeni. Kako se nositi s tim napisano je u članku o demaskiranju.

Drugi primjer. Ovdje je html stranica pokrivena programom HTML Protector. Ovo je stranica koja pokazuje mogućnosti programa, tako da su tamo uključene sve opcije: blokiranje odabira i kopiranja teksta, onemogućavanje desne tipke miša, zaštita slika, skrivanje statusne trake, šifriranje html koda itd. Otvorimo izvorni kod i pogledajmo. Na samom vrhu nalazi se već poznati dokument.write i šifrirana skripta. Provodimo ga kroz dekoder, dobivamo funkciju za dešifriranje glavnog sadržaja:

Kod (JavaScript):

  1. hp_ok = true ;function hp_d01 (s )( ... cut ... o = ar . join ("" )+ os ; document . write (o )

Zamjenjujemo posljednji dokument.write u funkciji s dekoderom i ubacujemo iza njega sve tri preostale šifrirane skripte:

  1. < script type = "text/javascript" >
  2. // Prvo ovdje zalijepite šifriranu skriptu
  3. // zamijeni sve pozive eval() i document.write() s decoder().
  4. hp_ok = true ;function hp_d01 (s)( .... o = ar . join ("" )+ os ; dekoder (o );
  5. hp_d01 (unescape (">QAPKRV%22NCLEWC ....
  6. hp_d01 (poništi izlaz ( ">QAPKRV%22NCLEWCEG? HctcQa ...
  7. hp_d01 (poništi izlaz ( ">`mf(%22`eamnmp? !DDDDDD %22v ...

Radi praktičnosti, skripte nisu dane u cijelosti u ovom članku; morate ih kopirati u cijelosti. Otvorimo dekoder u pregledniku i vidimo sigurnosne skripte koje je dodao program i dešifrirani izvorni tekst stranice. Radi praktičnosti, možete dešifrirati samo treću skriptu, koja sadrži html kod stranice. To je sva zaštita. Kao što vidite, ništa komplicirano. Ostale zaštite za HTML stranice uklanjaju se na isti način.

Prijeđimo s ručnog dešifriranja na automatsko dešifriranje. Da bih uklonio prvu vrstu zaštite, malo sam modificirao vama već poznatu skriptu Beautify Javascript i preveo je u exe datoteku. Bez problema se nosi s većinom JavaScript zaštita i omotača koje sam vidio.

Eval.JavaScript.Unpacker.1.1-PCL.rar (12.124 bajta)


Za teže slučajeve, morat ćete koristiti teško topništvo. Ovo je besplatan projekt osmišljen za istraživanje trojanaca i drugog zlonamjernog koda. Budući da su svi programi namijenjeni zaštiti autorskih prava očito zlonamjerni, Malzilla će nam pomoći u borbi protiv njih. Preuzmite (trenutno je 1.2.0), raspakirajte, pokrenite. Otvorite drugu karticu Decoder, zalijepite kod šifrirane skripte u gornji prozor, pritisnite gumb Pokreni skriptu.



U mapi procjena_temp Zbrajaju se svi rezultati izvršavanja funkcija eval(), uključujući srednje. Možete ih pogledati klikom na gumb Prikaži rezultate eval()., tekst će se otvoriti u donjem prozoru. Može se kopirati, zalijepiti u gornji prozor i odmah formatirati pritiskom na gumb Format koda. Osim dekodera, Malzilla ima mnogo više alata i postavki koje olakšavaju uklanjanje zaštite s JavaScript skripti.



Također možete obratiti pozornost na još jedan besplatni alat za rad s šifriranim skriptama - FreShow. Ima manje funkcija, ali ima gdje biti. S druge strane možete preuzeti demo video koji prikazuje primjer rada s programom.

Kao što vidite, nema ništa teško u uklanjanju zaštite s JavaScript skripti i html stranica. Nastavljate li i dalje braniti svoja podla "autorska prava"? Onda idemo k vama!

Ispod svih prekrasnih slika, savršene tipografije i prekrasno postavljenih poziva na akciju nalazi se izvorni kod vaše web stranice.

Svaki dan vaš preglednik pretvara ovaj kod u impresivne stranice za vaše posjetitelje i klijente.

Google i druge tražilice "čitaju" ovaj kod kako bi odredile gdje bi se vaše web stranice trebale pojaviti u njihovim indeksima za određeni upit za pretraživanje.

Stoga je vrlo važno za optimizacija pretraživača(SEO) ima ono što je u izvornom kodu.

Ovaj brzi vodič pokazat će vam kako čitati izvorni kod vaše web-lokacije kako biste bili sigurni da je vaš SEO ispravan i naučit će vas kako provjeriti svoje SEO uvjete.

Također ćemo pogledati nekoliko drugih situacija u kojima će vam znanje kako pregledati i ispitati glavne dijelove izvornog koda pomoći u drugim marketinškim naporima.

Kako vidjeti izvorni kod.

Prvi korak u provjeri izvornog koda vaše web-lokacije jest pogledati stvarni izvorni kod. Bilo koji web preglednik omogućuje vam da to jednostavno učinite.

Ispod su naredbe tipkovnice za pregled izvornog koda vaše web stranice PC I Mac.

  • Firefox - CTRL + U (Držite tipku CTRL i pritisnite tipku "U") Alternativno, možete otići na izbornik "Firefox", zatim kliknuti "Web Developer" i zatim "Page Source".
  • Internet Explorer- CTRL + U. Ili kliknite desni klik mišem i odaberite “View Source”.
  • Chrome - CTRL + U. Možete kliknuti na sliku ključa s tri vodoravne crte u gornjem desnom kutu. Zatim kliknite na "Alati" i odaberite "View Source".
  • Opera - CTRL + U. Također možete kliknuti desnom tipkom miša na web stranicu i odabrati "View Page Source."

Mac

  • Safari - tipkovnički prečac je Option + Command + U. Također možete kliknuti desnom tipkom miša na web stranicu i odabrati Prikaži izvor stranice.
  • Firefox - možete kliknuti desnom tipkom miša i odabrati "izvor" ili možete otići do izbornika "Alati", odabrati "Web programer" i kliknuti "Izvor stranice". Tipkovnički prečac je Ctrl + U.
  • Chrome - idite na "View", zatim kliknite "developer" i zatim "View Source". Također možete kliknuti desnom tipkom miša i odabrati "View Page Source." Tipkovnički prečac je Option + Command + U.

Nakon što znate kako vidjeti izvorni kod, trebali biste znati kako ga pretraživati.

Obično se iste značajke pretraživanja koje koristite prilikom pregledavanja weba također primjenjuju i na pretraživanja izvora.

Naredbe CTRL + F (pronađi) pomoći će vam da brzo vidite izvorni kod važnih SEO elemenata.

Naslovne oznake.

Naslovna oznaka je najvažniji element SEO-a. Ovo je najvažnija stvar u izvornom kodu.

Ako iz ovog članka namjeravate uzeti samo jednu vrijednu stvar, razmislite o ovome:

Znate, ovo su rezultati koje Google daje kada nešto tražite.

Svi ovi rezultati preuzeti su iz naslovnih oznaka web stranica. Dakle, ako nemate oznake naslova u svom izvornom kodu, možda se nećete pojaviti na Googleu (ili bilo kojoj drugoj tražilici).

Vjerovali ili ne, vidio sam web stranice bez naslovnih oznaka. Pokušajmo brzo pretražiti Google za izraz " Marketinški vodiči". Što vidimo:

Možete vidjeti prvi rezultat pretraživanja za blog KISSmetrics poglavlje Marketinški vodiči.

Ako slijedimo poveznicu prvog rezultata pretraživanja i pogledamo izvorni kod stranice, možemo vidjeti oznaku u naslovu:

Naslovna oznaka označena je početnom oznakom: </b>. i završava završnom oznakom: <b></ <i>titula</i>> </b>. Naslovna oznaka obično se nalazi na vrhu izvornog koda u odjeljku <b><head> </b>. </i></p> <p>I možemo vidjeti da sadržaj unutar oznake naslova odgovara onome što se koristi u naslovu rezultata <a href="https://bakep.ru/hr/kak-vyiti-iz-akkaunta-v-prilozhenii-gmail-kak-na-androide-vyiti-iz-google-akkaunta-gmail.html">Google pretraživanje</a>.</p> <p>No nisu samo oznake naslova potrebne za uključivanje u Google rezultate pretraživanja.</p> <p>Google također identificira riječi u naslovnim oznakama kao važne ključne riječi za koje vjeruje da su relevantne za korisnička pretraživanja.</p> <p>Dakle, ako želite dobiti određenu web stranicu u poretku za određenu temu, onda bolje provjerite jesu li riječi koje opisuju predmet uključene u oznaku naslova.</p> <p>Postoji niz internetskih izvora na kojima možete saznati više o tome kako <a href="https://bakep.ru/hr/a-set-of-tags-for-video-with-animals-how-to-learn-and-add-keywords-tags-for-youtube-in-video-per-channel.html">ključne riječi</a> i naslovne oznake igraju važnu ulogu u cjelokupnoj arhitekturi vaše stranice.</p> <p>Evo nekoliko važnih točaka koje će vam omogućiti da zapamtite važnost svojih oznaka naslova:</p> <ul><li>Provjerite imate li samo jednu oznaku naslova po web stranici.</li> <li>Pobrinite se da svaka web-stranica na vašem web-mjestu ima vlastitu oznaku naslova.</li> <li>Provjerite je li svaka oznaka naslova na vašoj web stranici jedinstvena. Nikada nemojte duplicirati sadržaj određene oznake naslova.</li> </ul><h3></h3> <p>Sljedeći <a href="https://bakep.ru/hr/pesnya-dlya-roditelei-na-svadbe-pesnya-ot-roditelei-na-svadbe.html">važan element</a> Glavni dio vaše web stranice je meta description tag.</p> <p>Ovo je isječak vašeg sadržaja od 160 znakova koji se pojavljuje ispod vašeg naslova u tražilicama.</p> <p><img src='https://i0.wp.com/infobiz-tools.com/wp-content/uploads/2014/02/read-website.png' height="511" width="500" loading=lazy loading=lazy></p> <p>Vidio sam stotine stranica koje potpuno ignoriraju ovu oznaku. Vrlo je lako pronaći u izvornom kodu:</p> <p><img src='https://i0.wp.com/infobiz-tools.com/wp-content/uploads/2014/02/how-read1.png' width="100%" loading=lazy loading=lazy></p> <p>Dakle, provjerite i uvjerite se da je ova oznaka prisutna na svim web stranicama vaše stranice. Još važnije, pobrinite se da ga ne duplicirate na više stranica.</p> <p>Dupliciranje meta description taga nije kazna za tražilicu, ali je vrlo velika marketinška greška.</p> <p>Mnogi ljudi ignoriraju oznaku meta description, ali stvarno biste trebali poraditi na njoj jer se čita <a href="https://bakep.ru/hr/tendencii-razvitiya-poiskovyh-sistem-poiskovye-sistemy-interneta-kakie.html">pretraživač</a>.</p> <p>Razmislite o tome kako će oznaka meta opisa pomoći privući više posjetitelja i povećati ciljane pretvorbe na vašu web-lokaciju.</p> HTML kod je u biti sama vaša stranica; on točno određuje kako će vaša stranica biti izgrađena i prikazana na zaslonu korisnika. U pravilu, ovaj kod je otvoren, što znači da ga svaki korisnik može lako vidjeti i pročitati. Ako iz ovog ili onog razloga ne želite da itko <b>imao pristup vašem kodu</b>, Možeš . To uključuje stvaranje posebnog algoritma koji <b>kodira vaš kod</b>, odnosno skriva svoj primarni izgled, čineći ga nedostupnim korisnicima stranice. <h2>Kada i kome može zatrebati?</h2>Apsolutno svaki webmaster ili vlasnik web stranice može napraviti ovu enkripciju. Pitanje je koliko je to opravdano i potrebno. Na primjer, ako imate običnu odredišnu stranicu izrađenu pomoću predloška i koja se ne razlikuje od ostalih, nema smisla kodirati, jer je takav predložak već javno dostupan. U ovom slučaju malo je vjerojatno da će itko kopirati i proučavati vaš kod. Ali ako imate web stranicu koja ima jedinstven dizajn, dugo ste i mukotrpno radili na njoj ili ste platili mnogo novca za nju, onda ipak vrijedi razmisliti o kodu. Vrlo su česti slučajevi kada vlasnik ima web stranicu u koju je uloženo puno truda, vremena i novca, a nakon nekog vremena, na ovaj ili onaj način, otkrije potpuno istu web stranicu, istog dizajna i strukture, ali na drugoj domeni i hostingu. Vrlo često vlasnicima web stranica to govore sami korisnici u komentarima. U ovom slučaju možemo sa sigurnošću zaključiti da netko jednostavno <b>kopirao HTML kod</b> svoju stranicu i pokrenuo je na mojoj. <h2>Što trebate učiniti da se zaštitite?</h2>Nije se lako zaštititi od situacija kopiranja i korištenja tuđeg HTML koda bez dopuštenja. I općenito, ako je osoba već vidjela vašu stranicu, moći će je duplicirati čak i bez koda, pod uvjetom da ima određeno znanje u području web razvoja. No, što se tiče samog HTML koda, on se može šifrirati. Ovo radi na temelju posebne javascript skripte. S našim alatom... U tom slučaju stvara se posebna skripta koja je namijenjena dešifriranju. Radi vrlo jednostavno: kada posjetitelj ode na vašu stranicu, učitava se šifrirani kod koji on ne može razumjeti. Istog trenutka pokreće se kreirani javascript koji dekriptira kod i prikazuje stranicu na ekranu korisnika. Istovremeno, sam posjetitelj ne može vidjeti pravi kod. Međutim, ova metoda ima i mali nedostatak. Postoje korisnici čiji preglednici ne dopuštaju pokretanje javascripta na web-mjestu; u ovom slučaju skripta se neće pokrenuti, stoga se HTML kod neće dešifrirati i web-mjesto neće biti prikazano. Ali nemojte se uzrujavati, takve su postavke preglednika vrlo rijetke, možemo reći da 99% preglednika dopušta pokretanje javascripta. <h2>Kako to učiniti?</h2>To se može učiniti vrlo jednostavno pomoću našeg alata. Sve što trebate učiniti je zalijepiti svoj HTML kod u polje na ovoj stranici i kliknuti na gumb za početak enkripcije. Kao rezultat toga, u drugom polju dobit ćete već šifrirani kod koji se već može koristiti izravno na vašoj web stranici. 1 glas <p>Dobar dan, dragi čitatelji mog bloga. Ponekad pronađete neku lijepu značajku na web stranici i počnete se pitati kako je kreator postigao tako zanimljiv učinak.</p> <p>Ispostavilo se da je odgovor vrlo jednostavan. A ako imate neke vještine, možete prikupiti puno ovih značajki i stvoriti vlastitu jedinstvenu web stranicu u kratkom vremenu.</p> <p>Danas ćemo razgovarati o tome kako otvoriti kod stranice, određenog elementa i naučiti kako koristiti ovu vještinu za svoju korist.</p> <h2><span>Osnovno poznavanje koda</span></h2> <p>Moja stranica je namijenjena početnicima i prvo bih želio ukratko govoriti o stranicama i kodu općenito.</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/cit1-75-537x292.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Nacrtati sliku, zatim je izrezati na male dijelove, napisati kod tako da će preglednik ponovno sastaviti sve elemente u jednu cjelinu. Čini li se da je sve vrlo komplicirano? Nimalo, i nema smisla tugovati zbog toga.</p> <p>Tako nastaju kvalitetne web stranice. Ako hoćeš, uključi se u ovu stvar i proučavaj, ako nećeš, nitko te ne može prisiliti.</p> <p>Reći ću samo jedno... nema ništa ugodnije nego vidjeti kako se nerazumljive riječi koje si napisao pretvaraju u jedinstvenu cjelinu i oživljavaju: linkovi rade, gumbi se pomiču, slike se pomiču, tekst puzi. Mislim da znam kako se osjećao Victor Frankenstein.</p> <p>Kada počnete shvaćati tajni jezik i vidite da je zapravo sve puno jednostavnije nego što se u početku činilo, ne možete a da ne povjerujete u vlastite snage i sposobnosti mozga. Ovo je jako cool.</p> <p>Kako se izrađuju web stranice? Idealno, prvo. On samo slika sliku. Na primjer, kao što je prikazano na slici ispod. Za sada je to samo slika, fotografija. Nijedan link ne radi, kada kliknete ne idete nikamo, ne provodi se nikakva pretraga.</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/Screenshot_1-46.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Prema ovom crtežu. Pogledajte snimak zaslona u nastavku. Možda mislite da je ovo smiješan i vrlo složen skup simbola. Zapravo, sve nije tako komplicirano, postoji određeni algoritam.</p> <p>Postoji samo oko 150 oznaka i svaka od njih odgovorna je za određenu radnju: poveznicu, rastavljanje crtica, podebljano, boju, naslov i tako dalje. Razumjeti ih nije tako teško ako imate želju i ne smeta vam vrijeme.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_2-43.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Zahvaljujući poznavanju ovih atributa, možete riješiti gotovo svaki problem. Ali svaki programer pronalazi svoje načine za postizanje cilja.</p> <p>Iskusni kreatori odmah vide kako postići rezultate, dok drugi moraju razmišljati, tražiti odgovor u člancima ili u izvornom kodu konkurenata. Jednostavno preuzmu potrebni dio sa stranice treće strane i uređuju ga za sebe. To značajno skraćuje proces rada.</p> <p>Malo kasnije ću vam pokazati <a href="https://bakep.ru/hr/zarabatyvayut-li-bloggery-na-yutube-i-skolko-skolko-mozhno-zarabotat-na.html">konkretan primjer</a>.</p> <h2>Pogledaj kod</h2> <p>Dakle, dopustite mi da vam prvo pokažem kako postupiti ako trebate saznati tuđi html. Zatim ćemo detaljnije pogledati sva ostala pitanja.</p> <h3><span>Najbolji način</span></h3> <p>Metoda koju ću prvo opisati je malo komplicirana za početnike, ali kao uvod, pročitajte je. Otvorite stranicu i kliknite desnom tipkom miša. Odaberite "Spremi kao..."</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/Screenshot_2-1-1.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Spremite cijelu web stranicu. Kao što vidite na snimci zaslona, ​​sve sam već preuzeo unaprijed. Ovdje imamo dvije mape.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_2-2-1.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Sve što trebate je ovdje. Svaki element. Ako ovo razumijete, možete brzo dobiti sve što vam je potrebno. Ali takav zadatak sve više postaje nemoguć. Nema preuzimanja. Što učiniti ako je zabranjeno kopiranje stranice?</p> <h3><span>Ovo je Google Chrome</span></h3> <p>Kao što ste već mogli primijetiti, najčešće koristim <a href="https://bakep.ru/hr/ispolzuem-google-cloud-print-bez-google-chrome-chto-takoe-virtualnyi-printer.html">Google Chrome</a> a učenje tuđeg koda u ovom pregledniku jednostavno je poput guljenja kruške. Kao u principu i sa svakim drugim. Shema neće biti samo slična, već i identična. Otvorite stranicu čiji kod želimo znati i desnom tipkom miša kliknite bilo gdje. U prozoru koji se pojavi kliknite "Prikaži kod stranice".</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/Screenshot_3-40.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>U novom prozoru otvorit će se list koda, što je početniku prilično teško razumjeti. Ali nemojte biti uznemireni prije vremena.</p> <p><img src='https://i1.wp.com/start-luck.ru/wp-content/uploads/Screenshot_4-36.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Ako trebate znati kod samo jednog elementa, samo prijeđite mišem iznad njega i kliknite desnom tipkom miša. Odaberite drugu Chromeovu funkciju: “Prikaz koda elementa”.</p> <p>Na primjer, moglo bi me zanimati kako je napravljen logo, pomoću slike ili programskog jezika? Uostalom, možete nacrtati kvadrat s <a href="https://bakep.ru/hr/how-to-align-the-right-edge-of-the-html-align-text-with-padding-css.html">css pomoć</a>. Mnogi stručnjaci savjetuju zapisivanje što više informacija u kodu. Kako funkcioniraju na popularnim stranicama?</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/Screenshot_5-33.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Sada su se pojavile potrebne informacije. html na vrhu, css na dnu. To su dva jezika. Prvi je odgovoran za tekstualnu komponentu, a drugi za dizajn. Da nema CSS-a, morali biste svaki put odrediti boju i veličinu fonta. Za svaku stranicu, ovo je jako dugo. Ali da nema html-a, ne bismo imali tekstove. Ugrubo sam objasnio, ali generalno, to je tako.</p> <p>Usput, ako vas zanima kako to radi ovdje, možete pogledati link na sliku ispod. Evo ti odgovora.</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/Screenshot_6-33.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <h3>Mozilla Firefox</h3> <p>Ako volite raditi u mastiku, onda će sve biti potpuno isto. Otvorite stranicu i kliknite desnom tipkom miša. “Izvorni kod stranice” ako želite vidjeti cijeli kôd.</p> <p><img src='https://i1.wp.com/start-luck.ru/wp-content/uploads/Screenshot_7-32.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Kada prijeđete pokazivačem iznad elementa, možete otvoriti njegov kod.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_8-29.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Ovdje se podaci prikazuju na dnu ekrana, ali inače je sve potpuno isto.</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/Screenshot_9-29.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <h3>Yandex preglednik</h3> <p>U pregledniku Yandex sve je potpuno isto kao u prethodne dvije opcije, otvorite stranicu, kliknite desnom tipkom miša, pogledajte kod stranice.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_10-27.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Lebdimo kursorom iznad elementa ako želimo točno saznati njegov kod.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_11-27.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Ovdje je sve prikazano potpuno isto kao u Chromeu.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_12-25.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <h3>Opera</h3> <p>I na kraju, Opera.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_13-24.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Usput, možda ste primijetili da ne morate koristiti miš. Postoji brzi tipkovnički prečac za otvaranje koda, a isti je za sve preglednike: <b>CTRL+U</b>.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_14-24.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Za elemente: Ctrl+Shift+C.</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/Screenshot_15-22.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Ovako izgleda rezultat.</p> <p><img src='https://i2.wp.com/start-luck.ru/wp-content/uploads/Screenshot_16-23.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <h2><span>Ovo će biti zanimljivo za početnike</span></h2> <p>Sada pogledajte kako sve funkcionira. Pronađete mjesto i jako vam se svidi neki element. Na primjer, ovaj. Već znate kako otvoriti kod elementa.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_17-20.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Sad kopiraj.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_18-19.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Koristim , zalijepite ovaj kod u novu html datoteku, u oznaku body (body na engleskom).</p> <p><img src='https://i1.wp.com/start-luck.ru/wp-content/uploads/Screenshot_19-18.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Sada da vidimo kako će to sve izgledati u pregledniku.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_20-16.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Spreman. Da bi se tekst poravnao po rubovima i dobio zelenkastu boju, potrebno je spojiti css na ovaj dokument i kopirati drugi kod sa stranice sa koje smo kopirali ovaj.</p> <p><img src='https://i1.wp.com/start-luck.ru/wp-content/uploads/Screenshot_21-16.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Neću to sada učiniti. Za to je potrebno više vremena: i mog i vašeg. Mislim da ću sve detalje opisati u svojim budućim publikacijama. Pretplatite se na newsletter i budite prvi koji će saznati kada se članak pojavi.</p> <p>Ako ne možete podnijeti, ali želite sada naučiti više o html-u i css-u, tradicionalno vam mogu preporučiti besplatne tečajeve.</p> <p>Ovdje su 33 lekcije koje će vam omogućiti da savladate html - <i><b><span>"Besplatni tečaj o HTML-u"</span> </b> </i>.</p> <p><img src='https://i1.wp.com/start-luck.ru/wp-content/uploads/Screenshot_22-16-537x476.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>A ovdje su potpune informacije o css-u - <i><b><span>“Besplatni tečaj o CSS-u (45 video lekcija!)”</span> </b> </i>.</p> <p><img src='https://i0.wp.com/start-luck.ru/wp-content/uploads/Screenshot_23-15.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Sad znaš malo više. Želim vam uspjeh u vašim nastojanjima. Vidimo se opet!</p> <p><a href="https://bakep.ru/hr/istoriya-sozdaniya-i-razvitiya-brauzera-mozilla-firefox-istoriya.html">Mozilla Firefox</a> Proširite odjeljak "Prikaz" u izborniku i kliknite "Izvorni kod". Ista točka je u <a href="https://bakep.ru/hr/why-on-the-desktop-are-large-icons-how-to-make-big-icons.html">kontekstni izbornik</a>, koji ako desnom tipkom miša kliknete tekst stranice. Također možete koristiti tipkovnički prečac CTRL + U. Mozilla FireFox ne koristi vanjske programe - izvorni kod stranice s označenom sintaksom otvorit će se u zasebnom prozoru preglednika.</p> <p>U Internet Exploreru kliknite izbornik Datoteka i odaberite Uredi u Notepadu. Umjesto naziva Notepad može biti napisano drugo ime koje ste dodijelili u postavkama preglednika za pregled izvornog koda. Desnim klikom na stranicu pojavljuje se kontekstni izbornik koji također ima stavku koja vam omogućuje otvaranje izvornog koda stranice u vanjskom programu - “View HTML Code”.</p> <p><img src='https://i1.wp.com/st03.kakprosto.ru/tumb/680/images/article/2011/7/8/1_52552b95df96052552b95df9bd.jpg' height="669" width="663" loading=lazy loading=lazy></p> <p>U <a href="https://bakep.ru/hr/how-to-add-an-express-panel-in-chrome-transferring-bookmarks-from-the-opera-browser.html">Preglednik Opera</a> otvorite izbornik, idite na odjeljak "Stranica" i imat ćete priliku odabrati stavku "Izvorni kod" ili stavku "Izvorni kod okvira" u pododjeljku "Alati za razvoj". Ovim odabirima dodijeljene su tipke prečaca CTRL + U odnosno CTRL + SHIFT + U. Kontekstni izbornik povezan s desnim pritiskom na stranicu također ima stavku "Izvorni kod". Opera otvara izvor stranice u vanjskom programu koji je određen u OS-u ili u postavkama preglednika za uređivanje HTML datoteka.</p> <p><img src='https://i2.wp.com/st03.kakprosto.ru/tumb/680/images/article/2011/7/8/1_52552b95eb30952552b95eb346.jpg' width="100%" loading=lazy loading=lazy></p> <p><a href="https://bakep.ru/hr/required-settings-in-google-chrome-the-most-important-settings-for-the-google-chrome-browser.html">Google preglednik</a> Chrome ima, bez sumnje, najbolje iskustvo gledanja izvornog koda. Desnim klikom na stranicu možete odabrati “View page code” i tada će se izvorni kod s isticanjem sintakse otvoriti u posebnoj kartici. Ili možete odabrati redak “View element code” u istom izborniku i preglednik će na istoj kartici otvoriti dva dodatna okvira u kojima možete pregledati HTML i CSS kod bilo kojeg elementa stranice. Preglednik će odgovoriti na pomicanje kursora preko redaka koda označavanjem elemenata na stranici koji odgovaraju tom dijelu HTML koda.</p> <p><img src='https://i1.wp.com/st03.kakprosto.ru/tumb/680/images/article/2011/7/8/1_52552b9603c4652552b9603c84.jpg' width="100%" loading=lazy loading=lazy></p> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy loading=lazy>");</script> </div> <footer> <div class="td-post-source-tags"> </div> <meta itemscope itemprop="mainEntityOfPage" itemType="https://schema.org/WebPage" itemid="https://bakep.ru/kak-bystro-otkryt-kod-stranicy-v-brauzere-dazhe-esli-kopirovanie-zapreshcheno.html" content="https://bakep.ru/kak-bystro-otkryt-kod-stranicy-v-brauzere-dazhe-esli-kopirovanie-zapreshcheno.html" /><span style="display: none;"><span style="display: none;"><meta itemprop="url" content="/assets/logo.svg"></span> <meta itemprop="name" content="Как быстро открыть код страницы в браузере, даже если копирование запрещено. Распаковка и расшифровка скриптов JavaScript Как расшифровать html код страницы"> </span> <meta itemprop="headline " content="Сбербанк Копилка онлайн"><span style="display: none;" itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><meta itemprop="url" content="https://i2.wp.com/manhunter.ru/upload/1a/87/1a870b5012697202749e9805fa585605.jpg"> <meta itemprop="width" content="366"><meta itemprop="height" content="262"></span> </footer> </article> <style> .ads-border { overflow: hidden; } .ads-content { width: 930px; display: block; } @media(max-width: 1140px) { .ads-content { width: 910px; } } @media(max-width: 1018px) { .ads-content { width: 970px; } } @media (max-width: 767px) { .ads-content { width: 134%; } } @media (max-width: 479px) { .ads-content { width: 100%; height: 490px; } } </style> <div class="ads-block"> <h4 class="td-related-title"><span class="td-related-left td-cur-simple-item">POVEZANI ČLANCI</span></h4> <div class="ads-border"> <div class="ads-content"> </div> </div> </div> <style> #mc-container { padding: 10px; } </style> <dblock></dblock> </div> </div> <div class="td-pb-span4 td-main-sidebar" role="complementary"> <div class="td-ss-main-sidebar"> <aside class="widget widget_text" id="text-23"> <div class="block-title"><span>Koristan</span></div> <div class="textwidget" align="center"></div> </aside> <aside class="widget widget_text" id="text-24"> <div class="block-title"><span>Oglašavanje</span></div> <div class="textwidget" align="center"></div> </aside> <aside class="widget widget_text" id="text-25"> <div class="textwidget"> <p style="text-align: center;"> </p> </div> </aside> <aside class="widget rpwe_widget recent-posts-extended" id="rpwe_widget-4"> <div class="block-title"><span>Novi</span></div> <dblock></dblock> <div class="rpwe-block "> <ul class="rpwe-ul"> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/koordinaty-v-gugl-maps-koordinaty-v-google-earth.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i1.wp.com/deus1.com/images/interesoe-sekrety/let-obekt-300x188.jpg" alt="Google Earth koordinate" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/koordinaty-v-gugl-maps-koordinaty-v-google-earth.html" title="Google Earth koordinate" rel="bookmark">Google Earth koordinate</a> </li> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/kak-sbrosit-zavodskie-nastroiki-na-samsung-s3370-kak-sbrosit-nastroiki-na.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i1.wp.com/syl.ru/misc/i/ai/376086/2345526.jpg" alt="Kako resetirati postavke na Samsungu" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/kak-sbrosit-zavodskie-nastroiki-na-samsung-s3370-kak-sbrosit-nastroiki-na.html" title="Kako resetirati postavke na Samsungu" rel="bookmark">Kako resetirati postavke na Samsungu</a> </li> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/gde-nahoditsya-podsvetka-na-noutbuke-kak-vklyuchit-podsvetku.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i2.wp.com/ledjournal.info/wp-content/uploads/2018/06/msi.jpg" alt="Kako uključiti pozadinsko osvjetljenje tipkovnice na prijenosnom računalu Asus" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/gde-nahoditsya-podsvetka-na-noutbuke-kak-vklyuchit-podsvetku.html" title="Kako uključiti pozadinsko osvjetljenje tipkovnice na prijenosnom računalu Asus" rel="bookmark">Kako uključiti pozadinsko osvjetljenje tipkovnice na prijenosnom računalu Asus</a> </li> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/operatory-yandeks-vordstat-kak-bystro-utochnit-chastotnost-zaprosov-v-wordstat.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i0.wp.com/znet.ru/wp-content/uploads/2017/04/Screenshot_5-3.png" alt="Kako brzo provjeriti učestalost upita u Wordstatu Učestalost upita u Wordstatu" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/operatory-yandeks-vordstat-kak-bystro-utochnit-chastotnost-zaprosov-v-wordstat.html" title="Kako brzo provjeriti učestalost upita u Wordstatu Učestalost upita u Wordstatu" rel="bookmark">Kako brzo provjeriti učestalost upita u Wordstatu Učestalost upita u Wordstatu</a> </li> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/reiting-sistem-upravleniya-kontentom-kakaya-cms-luchshe-mister.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i0.wp.com/web-optimizator.com/wp-content/uploads/2018/01/1.png" alt="Ocjena sustava za upravljanje sadržajem" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/reiting-sistem-upravleniya-kontentom-kakaya-cms-luchshe-mister.html" title="Ocjena sustava za upravljanje sadržajem" rel="bookmark">Ocjena sustava za upravljanje sadržajem</a> </li> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/gde-lezhat-vidzhety-v-android-kak-ustanovit-vidzhety-na-smartfon-xiaomi-po-vneshnemu.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i2.wp.com/protabletpc.ru/wp-content/uploads/2015/02/vidget-na-android.jpg" alt="Kako instalirati widgete na Xiaomi pametni telefon" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/gde-lezhat-vidzhety-v-android-kak-ustanovit-vidzhety-na-smartfon-xiaomi-po-vneshnemu.html" title="Kako instalirati widgete na Xiaomi pametni telefon" rel="bookmark">Kako instalirati widgete na Xiaomi pametni telefon</a> </li> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/chto-takoe-apdeit-i-apdeity-yandeksa-chto-takoe-apdeit-i-apdeity-yandeksa-byl.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i1.wp.com/raskruty.ru/img/apdeity/apdeit-tic.png" alt="Što je ažuriranje i ažuriranja Yandexa Bilo je zadnje ažuriranje Yandexa" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/chto-takoe-apdeit-i-apdeity-yandeksa-chto-takoe-apdeit-i-apdeity-yandeksa-byl.html" title="Što je ažuriranje i ažuriranja Yandexa Bilo je zadnje ažuriranje Yandexa" rel="bookmark">Što je ažuriranje i ažuriranja Yandexa Bilo je zadnje ažuriranje Yandexa</a> </li> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/kak-ustanovit-ark-fail-na-kompyutere-kak-ustanovit-apk-fail-na-android.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i2.wp.com/smartphonus.com/wp-content/uploads/2015/03/033115_0830_2.png" alt="Kako instalirati APK datoteku na Android" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/kak-ustanovit-ark-fail-na-kompyutere-kak-ustanovit-apk-fail-na-android.html" title="Kako instalirati APK datoteku na Android" rel="bookmark">Kako instalirati APK datoteku na Android</a> </li> <li class="rpwe-li rpwe-clearfix"> <a class="rpwe-img" href="https://bakep.ru/hr/igry-s-chitami-bez-zvuka.html" rel="bookmark"> <img class="rpwe-aligncenter rpwe-thumb" src="https://i2.wp.com/gamevils.ru/wp-content/uploads/2016/11/igry-strelyalki-s-oruzhiem-2.jpg" alt="Igre s varalicama bez zvuka" loading=lazy loading=lazy></a> <a style="color: #169c4c; font-size:14px; font-weight:600;" href="https://bakep.ru/hr/igry-s-chitami-bez-zvuka.html" title="Igre s varalicama bez zvuka" rel="bookmark">Igre s varalicama bez zvuka</a> </li> </ul> </div> </aside> </div> </div> </div> </div> </div> <div class="td-footer-wrapper td-footer-template-3"> <div class="td-container"> <div class="td-pb-row"> <div class="td-pb-span12"> </div> </div> <div class="td-pb-row"> <div class="td-pb-span3 logo-footer"> <div class="td-footer-info"> <div class="footer-logo-wrap"><a href="https://bakep.ru/hr/"><img class="td-retina-data" src="/img/logo.png" data-retina="/img/logo.png" alt="Računalni savjeti za početnike" title="Računalni savjeti za početnike" / loading=lazy loading=lazy></a></div> <div class="footer-text-wrap"></div> <div class="footer-social-wrap td-social-style-2"></div> </div> <aside class="widget widget_text" id="text-16"> <div class="textwidget"> <script src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js"></script> <script src="//yastatic.net/share2/share.js"></script> <span class="ya-share2" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus,twitter"></span></div> </aside> </div> <div class="td-pb-span9 footer-discription"> <aside class="widget widget_text" id="text-5"> <div class="textwidget"> <p> <font size="2" color="grey"> </font> </p>© Računalni savjeti za početnike, 2023</div> </aside> </div> </div> </div> </div> <div class="td-sub-footer-container"> <div class="td-container"> <div class="td-pb-row"> <div class="td-pb-span12 td-sub-footer-menu"> <div class="td-sub-footer-main"> <div class="menu-foot-container"><ul id="menu-foot" class="td-subfooter-menu"> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-first td-menu-item td-normal-menu"><a href="https://bakep.ru/hr/feedback.html">Povratne informacije</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page td-menu-item td-normal-menu"><a href="https://bakep.ru/hr/sitemap.xml">Karta stranice</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page td-menu-item td-normal-menu"><a href="">O stranici</a></li> </ul></div> </div> </div> </div> </div> </div> </div> <script type="text/javascript"> jQuery(document).ready(function () { jQuery("span.ancored").replaceWith(function () { $this = jQuery(this); href = $this.attr("title"); text = $this.html(); return '<a href="' + href + '">' + text + '</a>'; } ) } ) </script> <link rel='stylesheet' id='font-awesome-css' href='//netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css?ver=4.4.0' type='text/css' media='all' /> <link rel='stylesheet' id='su-content-shortcodes-css' href='/assets/content-shortcodes.css' type='text/css' media='all' /> <link rel='stylesheet' id='su-box-shortcodes-css' href='/assets/box-shortcodes.css' type='text/css' media='all' /> <script type='text/javascript' src='/assets/jquery.form.min.js'></script> <script type='text/javascript'> /* <![CDATA[ */ var _wpcf7 = { "recaptcha":{ "messages":{ "empty":"\u041f\u043e\u0436\u0430\u043b\u0443\u0439\u0441\u0442\u0430, \u043f\u043e\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u0435, \u0447\u0442\u043e \u0432\u044b \u043d\u0435 \u0440\u043e\u0431\u043e\u0442."} },"cached":"1"} ; /* ]]> */ </script> <script type='text/javascript' src='/assets/scripts.js'></script> <script type='text/javascript' src='/assets/front.min.js'></script> <script type='text/javascript' src='/assets/imagesloaded.min.js'></script> <script type='text/javascript' src='/assets/masonry.min.js'></script> <script type='text/javascript' src='/assets/jquery.masonry.min.js'></script> <script type='text/javascript' src='/assets/rsvp.js'></script> <script type='text/javascript' src='/assets/tagdiv_theme.js'></script> <script type='text/javascript' src='/assets/comment-reply.min.js'></script> <script type='text/javascript'> var q2w3_sidebar_options = new Array(); q2w3_sidebar_options[0] = { "sidebar" : "td-default", "margin_top" : 25, "margin_bottom" : 320, "stop_id" : "", "screen_max_width" : 0, "screen_max_height" : 0, "width_inherit" : false, "refresh_interval" : 1500, "window_load_hook" : false, "disable_mo_api" : false, "widgets" : ['text-13'] } ; </script> <script type='text/javascript' src='/assets/q2w3-fixed-widget.min.js'></script> <script type='text/javascript' src='/assets/wp-embed.min.js'></script> <style type='text/css'> /*** Shortcodes Ultimate - box elements ***/ /* Common styles ---------------------------------------------------------------*/ .su-clearfix:before, .su-clearfix:after { display: table; content: " "; } .su-clearfix:after { clear: both; } /* Tabs + Tab ---------------------------------------------------------------*/ .su-tabs { margin: 0 0 1.5em 0; padding: 3px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background: #eee; } .su-tabs-nav span { display: inline-block; margin-right: 3px; padding: 10px 15px; font-size: 13px; min-height: 40px; line-height: 20px; -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topright: 3px; border-top-right-radius: 3px; color: #333; cursor: pointer; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s; } .su-tabs-nav span:hover { background: #f5f5f5; } .su-tabs-nav span.su-tabs-current { background: #fff; cursor: default; } .su-tabs-nav span.su-tabs-disabled { opacity: 0.5; filter: alpha(opacity=50); cursor: default; } .su-tabs-pane { padding: 15px; font-size: 13px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomright: 3px; border-bottom-right-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-left-radius: 3px; background: #fff; color: #333; } .su-tabs-vertical:before, .su-tabs-vertical:after { content: " "; display: table; } .su-tabs-vertical:after { clear: both; } .su-tabs-vertical .su-tabs-nav { float: left; width: 30%; } .su-tabs-vertical .su-tabs-nav span { display: block; margin-right: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-left-radius: 3px; } .su-tabs-vertical .su-tabs-panes { float: left; width: 70%; } .su-tabs-vertical .su-tabs-pane { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .su-tabs-nav, .su-tabs-nav span, .su-tabs-panes, .su-tabs-pane { -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important; } /* Styles for screens that are less than 768px */ @media only screen and (max-width: 768px) { .su-tabs-nav span { display: block; } .su-tabs-vertical .su-tabs-nav { float: none; width: auto; } .su-tabs-vertical .su-tabs-panes { float: none; width: auto; } } /* Spoiler + Accordion ---------------------------------------------------------------*/ .su-spoiler { margin-bottom: 1.5em; } .su-spoiler .su-spoiler:last-child { margin-bottom: 0; } .su-accordion { margin-bottom: 1.5em; } .su-accordion .su-spoiler { margin-bottom: 0.5em; } .su-spoiler-title { position: relative; cursor: pointer; min-height: 20px; line-height: 20px; padding: 7px 7px 7px 34px; font-weight: bold; font-size: 13px; } .su-spoiler-icon { position: absolute; left: 7px; top: 7px; display: block; width: 20px; height: 20px; line-height: 21px; text-align: center; font-size: 14px; font-family: FontAwesome; font-weight: normal; font-style: normal; -webkit-font-smoothing: antialiased; *margin-right: .3em; } .su-spoiler-content { padding: 14px; -webkit-transition: padding-top .2s; -moz-transition: padding-top .2s; -o-transition: padding-top .2s; transition: padding-top .2s; -ie-transition: padding-top .2s; } .su-spoiler.su-spoiler-closed > .su-spoiler-content { height: 0; margin: 0; padding: 0; overflow: hidden; border: none; opacity: 0; } .su-spoiler-icon-plus .su-spoiler-icon:before { content: "\f068"; } .su-spoiler-icon-plus.su-spoiler-closed .su-spoiler-icon:before { content: "\f067"; } .su-spoiler-icon-plus-circle .su-spoiler-icon:before { content: "\f056"; } .su-spoiler-icon-plus-circle.su-spoiler-closed .su-spoiler-icon:before { content: "\f055"; } .su-spoiler-icon-plus-square-1 .su-spoiler-icon:before { content: "\f146"; } .su-spoiler-icon-plus-square-1.su-spoiler-closed .su-spoiler-icon:before { content: "\f0fe"; } .su-spoiler-icon-plus-square-2 .su-spoiler-icon:before { content: "\f117"; } .su-spoiler-icon-plus-square-2.su-spoiler-closed .su-spoiler-icon:before { content: "\f116"; } .su-spoiler-icon-arrow .su-spoiler-icon:before { content: "\f063"; } .su-spoiler-icon-arrow.su-spoiler-closed .su-spoiler-icon:before { content: "\f061"; } .su-spoiler-icon-arrow-circle-1 .su-spoiler-icon:before { content: "\f0ab"; } .su-spoiler-icon-arrow-circle-1.su-spoiler-closed .su-spoiler-icon:before { content: "\f0a9"; } .su-spoiler-icon-arrow-circle-2 .su-spoiler-icon:before { content: "\f01a"; } .su-spoiler-icon-arrow-circle-2.su-spoiler-closed .su-spoiler-icon:before { content: "\f18e"; } .su-spoiler-icon-chevron .su-spoiler-icon:before { content: "\f078"; } .su-spoiler-icon-chevron.su-spoiler-closed .su-spoiler-icon:before { content: "\f054"; } .su-spoiler-icon-chevron-circle .su-spoiler-icon:before { content: "\f13a"; } .su-spoiler-icon-chevron-circle.su-spoiler-closed .su-spoiler-icon:before { content: "\f138"; } .su-spoiler-icon-caret .su-spoiler-icon:before { content: "\f0d7"; } .su-spoiler-icon-caret.su-spoiler-closed .su-spoiler-icon:before { content: "\f0da"; } .su-spoiler-icon-caret-square .su-spoiler-icon:before { content: "\f150"; } .su-spoiler-icon-caret-square.su-spoiler-closed .su-spoiler-icon:before { content: "\f152"; } .su-spoiler-icon-folder-1 .su-spoiler-icon:before { content: "\f07c"; } .su-spoiler-icon-folder-1.su-spoiler-closed .su-spoiler-icon:before { content: "\f07b"; } .su-spoiler-icon-folder-2 .su-spoiler-icon:before { content: "\f115"; } .su-spoiler-icon-folder-2.su-spoiler-closed .su-spoiler-icon:before { content: "\f114"; } .su-spoiler-style-default { } .su-spoiler-style-default > .su-spoiler-title { padding-left: 27px; padding-right: 0; } .su-spoiler-style-default > .su-spoiler-title > .su-spoiler-icon { left: 0; } .su-spoiler-style-default > .su-spoiler-content { padding: 1em 0 1em 27px; } .su-spoiler-style-fancy { border: 1px solid #ccc; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background: #fff; color: #333; } .su-spoiler-style-fancy > .su-spoiler-title { border-bottom: 1px solid #ccc; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background: #f0f0f0; font-size: 0.9em; } .su-spoiler-style-fancy.su-spoiler-closed > .su-spoiler-title { border: none; } .su-spoiler-style-fancy > .su-spoiler-content { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .su-spoiler-style-simple { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; } .su-spoiler-style-simple > .su-spoiler-title { padding: 5px 10px; background: #f0f0f0; color: #333; font-size: 0.9em; } .su-spoiler-style-simple > .su-spoiler-title > .su-spoiler-icon { display: none; } .su-spoiler-style-simple > .su-spoiler-content { padding: 1em 10px; background: #fff; color: #333; } /* Quote ---------------------------------------------------------------*/ .su-quote-style-default { position: relative; margin-bottom: 1.5em; padding: 0.5em 3em; font-style: italic; } /*.su-quote-style-default.su-quote-has-cite { margin-bottom: 3em; } */ .su-quote-style-default:before, .su-quote-style-default:after { position: absolute; display: block; width: 20px; height: 20px; background-image: url('../images/quote.png'); content: ''; } .su-quote-style-default:before { top: 0; left: 0; background-position: 0 0; } .su-quote-style-default:after { right: 0; bottom: 0; background-position: -20px 0; } .su-quote-style-default .su-quote-cite { display: block; text-align: right; font-style: normal; } .su-quote-style-default .su-quote-cite:before { content: "\2014\0000a0"; } .su-quote-style-default .su-quote-cite a { text-decoration: underline; } /* Pullquote ---------------------------------------------------------------*/ .su-pullquote { display: block; width: 30%; padding: 0.5em 1em; } .su-pullquote-align-left { margin: 0.5em 1.5em 1em 0; padding-left: 0; float: left; border-right: 5px solid #eee; } .su-pullquote-align-right { margin: 0.5em 0 1em 1.5em; padding-right: 0; float: right; border-left: 5px solid #eee; } /* Row + Column ---------------------------------------------------------------*/ .su-row { clear: both; zoom: 1; margin-bottom: 1.5em; } .su-row:before, .su-row:after { display: table; content: ""; } .su-row:after { clear: both; } .su-column { display: block; margin: 0 4% 0 0; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .su-column-last { margin-right: 0; } .su-row .su-column { margin: 0 0 0 4%; } .su-row .su-column.su-column-size-1-1 { margin-left: 0; margin-right: 0; } .su-row .su-column:first-child { margin-left: 0; } .su-column-centered { margin-right: auto !important; margin-left: auto !important; float: none !important; } .su-column img, .su-column iframe, .su-column object, .su-column embed { max-width: 100%; } @media only screen { [class*="su-column"] + [class*="su-column"]:last-child { float: right; } } .su-column-size-1-1 { width: 100%; } .su-column-size-1-2 { width: 48%; } .su-column-size-1-3 { width: 30.66%; } .su-column-size-2-3 { width: 65.33%; } .su-column-size-1-4 { width: 22%; } .su-column-size-3-4 { width: 74%; } .su-column-size-1-5 { width: 16.8%; } .su-column-size-2-5 { width: 37.6%; } .su-column-size-3-5 { width: 58.4%; } .su-column-size-4-5 { width: 79.2%; } .su-column-size-1-6 { width: 13.33%; } .su-column-size-5-6 { width: 82.66%; } /* Styles for screens that are less than 768px */ @media only screen and (max-width: 768px) { .su-column { width: 100% !important; margin: 0 0 1.5em 0 !important; float: none !important; } .su-row .su-column:last-child { margin-bottom: 0 !important; } } /* Service ---------------------------------------------------------------*/ .su-service { position: relative; margin: 0 0 1.5em 0; } .su-service-title { display: block; margin-bottom: 0.5em; color: #333; font-weight: bold; font-size: 1.1em; } .su-service-title img { position: absolute; top: 0; left: 0; display: block !important; margin: 0 !important; padding: 0 !important; border: none !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; } .su-service-title i { position: absolute; top: 0; left: 0; display: block !important; width: 1em; height: 1em; text-align: center; line-height: 1em; } .su-service-content { line-height: 1.4; } /* Box ---------------------------------------------------------------*/ .su-box { margin: 0 0 1.5em 0; border-width: 2px; border-style: solid; } .su-box-title { display: block; padding: 0.5em 1em; font-weight: bold; font-size: 1.1em; } .su-box-content { background-color: #fff; color: #444; padding: 1em; } .su-box-style-soft .su-box-title { background-image: url('../images/styles/style-soft.png'); background-position: 0 0; background-repeat: repeat-x; } .su-box-style-glass .su-box-title { background-image: url('../images/styles/style-glass.png'); background-position: 0 50%; background-repeat: repeat-x; } .su-box-style-bubbles .su-box-title { background-image: url('../images/styles/style-bubbles.png'); background-position: 0 50%; background-repeat: repeat-x; } .su-box-style-noise .su-box-title { background-image: url('../images/styles/style-noise.png'); background-position: 0 0; background-repeat: repeat-x; } /* Note ---------------------------------------------------------------*/ .su-note { margin: 0 0 1.5em 0; border-width: 0px; border-style: solid; } .su-note-inner { padding: 1em; border-width: 0px; border-style: solid; box-shadow: 3px 3px 6px #d0d0d0; } /* Expand ---------------------------------------------------------------*/ .su-expand { margin: 0 0 1.5em 0; } .su-expand-content { overflow: hidden; } .su-expand-link { margin-top: 0.5em; cursor: pointer; } .su-expand-link:hover { opacity: 0.7; filter: alpha(opacity=70); } .su-expand-link a, .su-expand-link a:hover, .su-expand-link a:active, .su-expand-link a:visited, .su-expand-link a:focus { display: inline; text-decoration: none; background: transparent; border: none; } .su-expand-link-style-default .su-expand-link a, .su-expand-link-style-default .su-expand-link a:hover { text-decoration: none; } .su-expand-link-style-underlined .su-expand-link span { text-decoration: underline; } .su-expand-link-style-dotted .su-expand-link span { border-bottom: 1px dotted #333; } .su-expand-link-style-dashed .su-expand-link span { border-bottom: 1px dashed #333; } .su-expand-link-style-button .su-expand-link a { display: inline-block; margin-top: 0.2em; padding: 0.2em 0.4em; border: 2px solid #333; } .su-expand-link-more { display: none; } .su-expand-link-less { display: block; } .su-expand-collapsed .su-expand-link-more { display: block; } .su-expand-collapsed .su-expand-link-less { display: none; } .su-expand-link i { display: inline-block; margin: 0 0.3em 0 0; vertical-align: middle; color: inherit; } .su-expand-link img { display: inline-block; width: 1em; height: 1em; margin: 0 0.3em 0 0; vertical-align: middle; } /* Lightbox content ---------------------------------------------------------------*/ .su-lightbox-content { position: relative; margin: 0 auto; } .mfp-content .su-lightbox-content, #su-generator .su-lightbox-content { display: block !important; } .su-lightbox-content-preview { width: 100%; min-height: 300px; background: #444; overflow: hidden; } .su-lightbox-content h1, .su-lightbox-content h2, .su-lightbox-content h3, .su-lightbox-content h4, .su-lightbox-content h5, .su-lightbox-content h6 { color: inherit; } /* Common margin resets for box elements ---------------------------------------------------------------*/ .su-column-inner > *:first-child, .su-accordion > *:first-child, .su-spoiler-content > *:first-child, .su-service-content > *:first-child, .su-box-content > *:first-child, .su-note-inner > *:first-child, .su-expand-content > *:first-child, .su-lightbox-content > *:first-child { margin-top: 0; } .su-column-inner > *:last-child, .su-tabs-pane > *:last-child, .su-accordion > *:last-child, .su-spoiler-content > *:last-child, .su-service-content > *:last-child, .su-box-content > *:last-child, .su-note-inner > *:last-child, .su-expand-content > *:last-child, .su-lightbox-content > *:last-child { margin-bottom: 0; } </style> <script> (function(){ var html_jquery_obj = jQuery('html'); if (html_jquery_obj.length && (html_jquery_obj.is('.ie8') || html_jquery_obj.is('.ie9'))) { var path = '/assets/style2.css'; jQuery.get(path, function(data) { var str_split_separator = '#td_css_split_separator'; var arr_splits = data.split(str_split_separator); var arr_length = arr_splits.length; if (arr_length > 1) { var dir_path = '/wp-content/themes/Newspaper'; var splited_css = ''; for (var i = 0; i < arr_length; i++) { if (i > 0) { arr_splits[i] = str_split_separator + ' ' + arr_splits[i]; } //jQuery('head').append('<style>' + arr_splits[i] + '</style>'); var formated_str = arr_splits[i].replace(/\surl\(\'(?!data\:)/gi, function regex_function(str) { return ' url(\'' + dir_path + '/' + str.replace(/url\(\'/gi, '').replace(/^\s+|\s+$/gm,''); } ); splited_css += "<style>" + formated_str + "</style>"; } var td_theme_css = jQuery('link#td-theme-css'); if (td_theme_css.length) { td_theme_css.after(splited_css); } } } ); } } )(); </script> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body> </html>