Fiecare internaut are propriile site-uri preferate pe care petrece mult timp. Și numai leneșii nu s-au gândit să se uite cum a fost creat și în ce constă. Este imposibil să răspunzi la toate aceste întrebări, deoarece există multe modalități de a crea un site web, dar să te uiți la comenzile și codurile care îl compun este posibil și disponibil public pentru toată lumea.

O altă întrebare este dacă o persoană care nu este implicată în programare va înțelege vreunul dintre simbolurile care compun codul. Dar din exemplele care vor fi date mai jos, orice utilizator Google Chrome va putea vizualiza elemente individuale ale site-urilor.

Pentru a putea vizualiza codul paginii în Chrome, trebuie să accesați site-ul care vă interesează și să efectuați următorii pași:

Aceste două elemente diferă prin funcționalitatea și informațiile pentru utilizator, programator sau hacker.

Analizând fiecare dintre aceste funcții, puteți scrie un articol separat. Pentru programatori, această diferență este semnificativă și înțeleg în ce cazuri este necesar să se folosească „Vizualizare cod” și în care „Vizualizare cod pagină” în browserul Google Chrome.

Dar explicând pentru utilizatorul obișnuit, aceste funcții pot fi împărțite în următoarele scopuri:

Dacă ar fi să răspundem la o astfel de întrebare, atunci singura opțiune care se sugerează este un exemplu. Pentru că într-un articol este foarte greu să devii o persoană care înțelege acest subiect (dezvoltator web), dar să arăți cu un exemplu astfel încât întrebarea să fie rezolvată este mult mai ușor.

Funcționalitatea codului elementului este foarte largă, așa că luăm unul dintre cuvintele de pe site-ul web al browserului Google Chrome. Am vrut să luăm în considerare ce cuvinte cheie (în cod va fi scris „cuvinte cheie”) au fost folosite pentru site-ul nostru. Pentru a face acest lucru, efectuăm următorul algoritm:

În general, continuând să răspundeți la întrebarea cum să priviți codul unui element și de ce este necesar, ar trebui să enumerați funcțiile acestuia. Și anume, datorită capacității de a vizualiza codul unui element al oricărui site în browserul Google Chrome, putem:

• Vezi structura site-ului pornind de la head (“site header”) și terminând cu end (comanda finală a oricărui program);
• Vizualizați toate funcțiile site-ului și anume: link-uri către alte site-uri, module suplimentare de pe site-uri externe și prezența contoarelor încorporate pentru colectarea diverselor informații;
• Aflați dacă copierea de pe site este interzisă sau nu;
• Codul va înregistra toate linkurile către alte pagini ale site-ului, precum și designul acestora și acțiunile ulterioare după ce faceți clic pe ele.

Aceasta nu este nicidecum o listă finită. Dar trebuie amintit că, fără cunoștințe speciale, este aproape imposibil să „citești” codul unei pagini Google Chrome, iar datele primite practic nu sunt necesare unui utilizator obișnuit.

Trebuie spus imediat că fiecare site va avea acces deschis la codurile de elemente. Adică, chiar și cele mai populare și mai scumpe site-uri vor fi deschise pentru vizualizarea codului lor. Prin urmare, dacă elementul din browserul Google Chrome nu este activ sau generează o eroare, acesta are următoarele motive posibile:

• Profilul utilizatorului este corupt;
• Prezența malware pe computer;
• Blocarea printr-o anumită extensie pentru a crește performanța (chiar și acest lucru se poate întâmpla).

Pentru a crea un profil nou, trebuie să-l ștergeți pe cel vechi de pe computer. Pentru a face acest lucru facem următoarele:

Dacă noul profil nu ne oferă acces la codul elementului de pagină și încă vedem eroarea, ar trebui să facem următoarele:

Dacă totul a fost făcut corect, atunci după repornirea computerului, Google Chrome va deschide codul elementelor și browserul va funcționa normal.

Dezvoltatorii de browsere au avut grijă de comoditatea celor care creează site-uri care se deschid în aceleași browsere, și anume webmasteri. Au adăugat instrumente pentru dezvoltatori la funcțiile standard, cu ajutorul cărora puteți deschide și vizualiza cu ușurință codul sursă al unei pagini de site într-un browser: HTML, CSS, JavaScript (JS), obțineți diverse date utile despre structura site-ului și conduceți analiza tehnică a acesteia. În general, vezi o mulțime de lucruri utile.

Desigur, aceste instrumente sunt folosite nu numai de creatorii de site-uri web pentru muncă, ci și de utilizatorii obișnuiți, pentru care codul sursă le permite să vizualizeze diverse date utile.

Din acest articol veți învăța cum să vizualizați codul sursă al unei pagini de site într-un browser (cum să deschideți codul HTML, CSS, JavaScript al unui site).

Există două moduri de a deschide codul sursă al unei pagini web într-un browser:

Ctrl + U este o combinație de taste rapide pentru a vizualiza codul sursă al întregii pagini a site-ului într-o fereastră nouă separată. Standard pentru toate browserele: Google Chrome, Opera, Mozilla Firefox, browser Yandex, IE.

De asemenea, puteți introduce instrumentele de dezvoltare după cum urmează:

Pentru a găsi rapid codul, cuvântul sau textul dorit pe o pagină, puteți utiliza combinația standard de taste rapide de căutare pentru toate browserele: Ctrl + G.

Instrucțiuni video:

Dacă dintr-o dată trebuie să vizualizați nu întregul cod sursă, ci să afișați doar o parte separată a acestuia, o zonă de pe pagină, atunci instrumentul anterior nu va funcționa. În acest scop, instrumentele de dezvoltare au o altă funcție, care va fi discutată mai jos.

Cum să vizualizați codul unui element pe o pagină:

De asemenea, puteți utiliza comenzile rapide de la tastatură pentru a accesa rapid inspecția elementelor.

Taste rapide (butoane):

Google Chrome: Ctrl+Shift+I și Ctrl+Shift+C

Opera: Ctrl+Shift+I și Ctrl+Shift+C

Mozilla Firefox: Ctrl+Shift+I și Ctrl+Shift+C

Browser Yandex: Ctrl+Shift+I și Ctrl+Shift+C

După acești pași, codul sursă al paginii web se va deschide în aceeași fereastră de browser:

Tot codul HTML va fi în coloana mare din stânga. Și stilurile CSS sunt în dreapta.

Avantajul acestei metode, desigur, este că utilizatorul are posibilitatea de a schimba codul sursă și de a edita stiluri. Adică poți edita stilurile de pe site și vezi cum va arăta cu anumite stiluri, fără a fi nevoie să faci imediat modificări fișierelor aflate pe serverele de găzduire. Pentru a modifica sau adăuga codul programului, trebuie să faceți dublu clic pe fragmentul sau zona dorită. Desigur, corectarea codului în browser nu se va face pe serverele de găzduire. Prin urmare, în viitor, în orice caz, va trebui să copiați acest cod și să-l scrieți în fișiere.

Această instrucțiune video descrie în detaliu și arată cum să lucrați cu instrumentele pentru dezvoltatori:

La fel, doar online, chiar în browser, puteți vizualiza codul sursă al paginii site-ului, puteți obține date de bază despre codul HTML și CSS, le puteți modifica și copia, fără a fi nevoie să descărcați fișierele acestui site pe computer. .

Apropo, utilizatorii de internet neexperimentați care au schimbat codul paginii și se așteaptă să fie salvat vor fi dezamăgiți. La urma urmei, după reîmprospătarea paginii, toate modificările de pe aceasta vor dispărea. Acest lucru nu este suficient pentru a pirata site-ul :)

De asemenea, aș dori să remarc faptul că instrumentele pentru dezvoltatori sunt disponibile nu numai în versiunea desktop a browserelor, adică pe computere și laptopuri. Pe telefoane și tablete (Android, iOS) puteți vizualiza și codul sursă.

Pentru a face acest lucru, adăugați prefixul sursă de vizualizare la adresa URL a paginii care este inspectată:

De exemplu:

vizualizare-sursa:https://site/turbo-rezhim-opera/

Sărbătoarea se apropie - Ziua Internațională a Femeii. Să ne pregătim din timp pentru asta. Puteți felicita fetele și femeile într-un mod original utilizând serviciile de cărți poștale discutate mai jos.

Utilizați următoarele servicii pentru a crea o carte poștală practic de la zero.

Sper că, folosind unul dintre aceste generatoare, veți putea să vă felicitați în mod adecvat doamnele pe 8 martie!

Conținutul articolului:

Confirmați trecerea la și introduceți numele sau porecla dvs.

Nu uitați să încărcați un avatar în profilul dvs. Blogger.

Astăzi vă voi spune ce este CSS3, cu ce se folosește, unde să îl căutați și cum să îl scrieți corect. Vă avertizez, voi spune de la mine, simplificat pentru publicul larg, așa cum văd eu + exemple. Deci, să începem de departe.
CSS sunt stiluri în care sunt scrise proprietățile unui obiect. Aceasta înseamnă că sunt în toate motoarele existente, dacă nu le puteți găsi, atunci fie că căutați în locul greșit, fie ele chiar nu există ( site strâmb). Unde se găsesc de obicei? De obicei aceasta este rădăcina site-ului, numele fișierului este style.css, deși, în principiu, numele nu este la fel de important ca extensia .css dacă fișierul cu o astfel de extensie este un fișier de stil.
Vezi si pe blogul meu.