Com veure la font HTML a Google Chrome

Què saber

• Feu clic amb el botó dret a la pàgina web i trieu Mostra la font .
• Drecera: premeu Ctrl + EN (PC amb Windows) o Comandament + Opció + EN (Mac).
• Per utilitzar les eines per a desenvolupadors de Chrome, seleccioneu Menú (tres punts) > Més eines > Eines per a desenvolupadors .

En aquest article s'explica com accedir al codi font HTML d'un lloc web al navegador web Google Chrome, així com accedir i utilitzar les eines de desenvolupament de Chrome. Veure el codi font d'un lloc és una manera excel·lent perquè els principiants aprenguin HTML.

Veure el codi font a Chrome

Aleshores, com veieu el codi font d'un lloc web? Aquí teniu les instruccions pas a pas per fer-ho amb el navegador Google Chrome.

1. Obriu el Navegador web Google Chrome (si no en tens Google Chrome instal·lat , aquesta és una descàrrega gratuïta).

2. Navegueu fins a pàgina web que voleu examinar .

3. Clic dret la pàgina i mira el menú que apareix. Des d'aquest menú, feu clic Mostra la font .

   

4. El codi font d'aquesta pàgina apareixerà ara com una pestanya nova al navegador.

5. Alternativament, també podeu utilitzar les tecles de drecera de Ctrl + EN en un ordinador per obrir una finestra amb el codi font d'un lloc mostrat. En un Mac, aquesta drecera és Comandament + Opció + EN .

Hilary Allison / Lifewire

com fer una animada a instagram

Utilitzeu les eines per a desenvolupadors de Chrome

A més del senzillMostra la fontcapacitat que ofereix Google Chrome, també podeu aprofitar la seva excel·lent Eines per a desenvolupadors per aprofundir encara més en un lloc. Aquestes eines us permetran no només veure l'HTML, sinó també el CSS que s'aplica per visualitzar els elements d'aquest document HTML.

Per utilitzar les eines per a desenvolupadors de Chrome:

1. Obert Google Chrome .

2. Navega a la pàgina web que voleu examinar .

3. Seleccioneu el menú de tres punts a l'extrem superior dret de la finestra del navegador.

4. Des del menú, passa el cursor per sobre Més eines i després tria Eines per a desenvolupadors al menú que apareix.

   

5. S'obrirà una finestra que mostra el codi font HTML a l'esquerra del panell i el CSS relacionat a la dreta.

6. Alternativament, si feu clic amb el botó dret un element d'una pàgina web i seleccioneu Inspeccionar al menú que apareix, apareixeran les eines per a desenvolupadors de Chrome i destacaran la part específica que trieu a l'HTML amb el CSS corresponent que es mostra a la dreta. És molt útil si voleu obtenir més informació sobre una part concreta d'un lloc.

   com activar els trucs als simuladors 4

És legal veure el codi font?

Al llarg dels anys, molts dissenyadors web nous s'han preguntat si és acceptable veure el codi font d'un lloc i utilitzar-lo per a la seva educació i, en última instància, per al treball que fan. Tot i que copiar el codi d'un lloc a l'engròs i fer-lo passar com a propi en un lloc web certament no és acceptable, utilitzar aquest codi com a trampolí per aprendre és en realitat quants avenços es fan en aquesta indústria.

Com hem esmentat a l'inici d'aquest article, us costaria trobar un professional web que treballi avui que no hagi après res veient la font d'un lloc! Sí, veure el codi font d'un lloc és legal. Utilitzar aquest codi com a recurs per crear alguna cosa semblant també és segur. Prendre el codi tal com és i fer-lo passar per la vostra feina és on comenceu a trobar problemes.

Al final, els professionals del web aprenen els uns dels altres i sovint milloren el treball que veuen i en què s'inspiren, així que no dubteu a veure el codi font d'un lloc i utilitzar-lo com a eina d'aprenentatge.

Més que HTML

Una cosa a recordar és que els fitxers font poden ser molt complicats (i com més complex sigui el lloc web que esteu veient, més complex és probable que sigui el codi d'aquest lloc). A més de l'estructura HTML que conforma la pàgina, també hi haurà CSS (fulls d'estil en cascada) que dicten l'aspecte visual d'aquest lloc. A més, molts llocs web d'avui inclouran fitxers de script inclosos juntament amb l'HTML.

com ratllar a Google Docs

És probable que s'incloguin diversos fitxers d'script; de fet, cadascun alimenta diferents aspectes del lloc. Francament, el codi font d'un lloc pot semblar aclaparador, sobretot si sou nou en fer-ho. No us frustreu si no podeu esbrinar què està passant amb aquest lloc immediatament. Veure la font HTML és només el primer pas d'aquest procés. Amb una mica d'experiència, començareu a entendre millor com encaixen totes aquestes peces per crear el lloc web que veieu al vostre navegador. A mesura que us familiaritzeu amb el codi, podreu aprendre més d'ell i no us semblarà tan descoratjador.

• Com edito el codi HTML a Chrome?

  Obriu Eines per a desenvolupadors a Chrome prement Ctrl (o Comandament en un Mac) + Maj + I . A partir d'aquí, premeu Ctrl ( Comandament a Mac) + O i seleccioneu el fitxer font desat que voleu editar per obrir-lo.

• Com puc veure el codi font de la pàgina a Chrome si Visualitza la font està desactivada?

  Si un lloc web ha desactivat l'opció Visualitza la font, és possible que encara pugueu fer una ullada sota el capó. A la part superior de la finestra del navegador, seleccioneu Veure > Desenvolupador > Veure la font , que hauria de mostrar el codi font de la pàgina web.

• Com puc veure el codi font d'un lloc a Chrome amb el meu dispositiu Android?

  Navegueu fins al lloc web que voleu veure amb l'aplicació Chrome del vostre dispositiu i, a continuació, seleccioneu la barra d'adreces del navegador. Mou el cursor de text a l'extrem esquerre (davant de l'URL) i escriviu Veure la font , després premeu Entra o seleccioneu Vés .