Näytä HTML-elementtien sisällysluettelo Chromen verkkosivustolla

click fraud protection

Hienostuneet web-kehitysohjelmat auttavat kirjoittamaan koodia helposti kuin jos tekisit sen ilman niitä. Sen lisäksi, että ne nopeuttavat työskentelyä ja auttavat välttämään yleisiä syntaksiongelmia, ne ovat myös loistava työkalu aloittelijoille, jotka saattavat tuntea olevansa tyytyväisiä yksinkertaisen HTML-sivun kirjoittamiseen vaadittavien määrien työhön. Jos ei muuta, ne voivat auttaa sinua oppimaan koodia. Ainoa puute, joka saatat kohdata verkkokehitysohjelmassa, etenkin kun käytät sitä koodaamiseen, on se, kuinka he eivät ole valmiita analysoimaan selaimesi verkkosivustoja. Jos erityinen kiinnostava alue on HTML, niin HTML5 Outliner on hieno Chrome-laajennus, joka auttaa sinua analysoimaan verkkosivun erilaisia ​​HTML-elementtejä. Laajennus lisää neliökuvaketta URL-palkkiin, jota napsautettaessa avataan sisällysluettelonäkymä kaikista HTML 5 -otsikoista ja osioista. Laajennus toimii myös HTML 4 -elementeissä.

Näytettävän sisällysluettelon kohteita voidaan napsauttaa ja laajennus vierittää ja korostaa valitsemasi elementin. Kohokohta ei aina toimi, mutta navigointi on täysin toiminnallista.

instagram viewer

HTML5 Outliner

Laajennuksella on rajoituksensa; se havaitsee kaikki HTML-elementit melkein millä tahansa sivulla, mutta sisällysluettelo itsessään on erilainen tarina. Taulukko perustuu siihen, että koodi on kirjoitettu asianmukaisten HTML 5 -määritelmien tai ääni-HTML-jäsentelyn mukaisesti. Jos koodi ei ole näiden mukainen, laajennus ei ehkä lataa hyväksyttävää sisällysluetteloa.

Esimerkiksi; Jos olet käyttänyt taulukoita sivusi ulkoasun määrittelemiseen, et todennäköisesti näe mitään sisällysluetteloa ollenkaan. Syynä tähän on vain huonosti kirjoitettu koodi, koska asettelut määritetään parhaiten CSS: llä, ei taulukoilla. Toistaiseksi et voi käyttää laajennusta paikallisesti tallennetuissa HTML-tiedostoissa johtuen pienestä laajennuksen rajoituksesta ja Chromen käyttöoikeuksista.

HTML5 Outliner ei selvästikään ole tavalliselle käyttäjälle; se on tarkoitettu web-kehittäjille, sekä aloittelijoille että ammattitaitoisille. Aloittelijoille sen tulee osoittautua käteväksi, kun esikatsellaan kehitteillä olevan sivuston asettelua. Ammattitaitoisille kehittäjille se on nopea tapa siirtyä verkkosivun elementtien välillä ja tarkistaa niiden takana oleva koodi.

Asenna HTML5 Outliner Chrome Web Storesta

watch instagram story