{"id":1871,"date":"2020-11-18T00:00:00","date_gmt":"2020-11-18T00:00:00","guid":{"rendered":"https:\/\/megnyitasa.com\/blog\/a-html-forras-megtekintese-a-google-chrome-ban\/"},"modified":"2020-11-18T00:00:00","modified_gmt":"2020-11-18T00:00:00","slug":"a-html-forras-megtekintese-a-google-chrome-ban","status":"publish","type":"post","link":"https:\/\/megnyitasa.com\/blog\/a-html-forras-megtekintese-a-google-chrome-ban\/","title":{"rendered":"A HTML-forr\u00e1s megtekint\u00e9se a Google Chrome-ban"},"content":{"rendered":"

\nF\u00fcggetlen\u00fcl att\u00f3l, hogy \u00faj vagy-e a webiparban vagy tapasztalt veter\u00e1n, a k\u00fcl\u00f6nb\u00f6z\u0151 weboldalak HTML-forr\u00e1sainak megtekint\u00e9s\u00e9vel val\u00f3sz\u00edn\u0171leg sokszor foglalkozol majd karriered sor\u00e1n. A legt\u00f6bb b\u00f6ng\u00e9sz\u0151 lehet\u0151v\u00e9 teszi a forr\u00e1s egyszer\u0171 megtekint\u00e9s\u00e9t; A Chrome sem k\u00fcl\u00f6nb\u00f6zik ett\u0151l.\n<\/p>\n

\nA webhely forr\u00e1sk\u00f3dj\u00e1nak megtekint\u00e9se az egyik legegyszer\u0171bb m\u00f3dja annak, hogy tanuljon az adott munk\u00e1b\u00f3l, \u00e9s elkezdjen konkr\u00e9t k\u00f3dot vagy technik\u00e1kat haszn\u00e1lni a munk\u00e1j\u00e1ban. A web-tervez\u0151 k\u00f6nyvek olvas\u00e1sa vagy a szakmai konferenci\u00e1kon val\u00f3 r\u00e9szv\u00e9tel mellett a webhely forr\u00e1sk\u00f3dj\u00e1nak megtekint\u00e9se kiv\u00e1l\u00f3 lehet\u0151s\u00e9g a kezd\u0151k sz\u00e1m\u00e1ra a HTML-tanul\u00e1shoz.\n<\/p>\n

Tekintse meg a forr\u00e1sk\u00f3dot a Chrome-ban <\/h2>\n

\nTeh\u00e1t hogyan tekintheti meg egy webhely forr\u00e1sk\u00f3dj\u00e1t? Itt vannak a l\u00e9p\u00e9senk\u00e9nti utas\u00edt\u00e1sok a Google Chrome b\u00f6ng\u00e9sz\u0151 haszn\u00e1lat\u00e1val.\n<\/p>\n

    \n
  1. \n

    \nNyissa meg a Google Chrome webb\u00f6ng\u00e9sz\u0151<\/strong> (ha nincs telep\u00edtve a Google Chrome, akkor ez ingyenesen let\u00f6lthet\u0151).\n<\/p>\n<\/li>\n

  2. \n

    \nNavig\u00e1ljon a weboldal, amelyet meg szeretne vizsg\u00e1lni<\/strong>.\n<\/p>\n<\/li>\n

  3. \n

    \nKattintson a jobb gombbal az oldal<\/strong> \u00e9s n\u00e9zd meg a megjelen\u0151 men\u00fct. Ebben a men\u00fcben kattintson a gombra Oldal forr\u00e1s\u00e1nak megtekint\u00e9se<\/strong>.\n<\/p>\n

    <\/p>\n<\/li>\n

  4. \n

    \nAz oldal forr\u00e1sk\u00f3dja \u00faj lapk\u00e9nt jelenik meg a b\u00f6ng\u00e9sz\u0151ben.\n<\/p>\n<\/li>\n

  5. \n

    \nAlternat\u00edv megold\u00e1sk\u00e9nt haszn\u00e1lhatja a CTRL + U<\/strong> egy sz\u00e1m\u00edt\u00f3g\u00e9pen, hogy megnyithasson egy ablakot a webhely forr\u00e1sk\u00f3dj\u00e1val. Mac-en ez a parancsikon Command + Option + U<\/strong>.\n<\/p>\n<\/li>\n<\/ol>\n

    Haszn\u00e1lja a Chrome fejleszt\u0151i eszk\u00f6zeit <\/h2>\n

    \nA Google Chrome \u00e1ltal k\u00edn\u00e1lt egyszer\u0171 Oldalforr\u00e1s-n\u00e9zet k\u00e9pess\u00e9g mellett a kiv\u00e1l\u00f3 Fejleszt\u0151i eszk\u00f6z\u00f6k el\u0151nyeit is felhaszn\u00e1lhatja, hogy m\u00e9g m\u00e9lyebben belem\u00e9lyedjen egy webhelybe. Ezek az eszk\u00f6z\u00f6k nemcsak a HTML, hanem a HTML dokumentum megtekint\u00e9si elemeire vonatkoz\u00f3 CSS \u200b\u200bmegtekint\u00e9s\u00e9t is lehet\u0151v\u00e9 teszik.\n<\/p>\n

    \nA Chrome fejleszt\u0151i eszk\u00f6zeinek haszn\u00e1lata:\n<\/p>\n

      \n
    1. \n

      \nNyisd ki Google Chrome<\/strong>.\n<\/p>\n<\/li>\n

    2. \n

      \nnavig\u00e1ljon a megvizsg\u00e1lni k\u00edv\u00e1nt weboldalt<\/strong>.\n<\/p>\n<\/li>\n

    3. \n

      \nV\u00e1lassza ki a h\u00e1rompontos men\u00fc<\/strong> a b\u00f6ng\u00e9sz\u0151ablak jobb fels\u0151 sark\u00e1ban.\n<\/p>\n<\/li>\n

    4. \n

      \nA men\u00fcb\u0151l mutasson az eg\u00e9rrel T\u00f6bb eszk\u00f6z<\/strong> majd v\u00e1lassza ki Fejleszt\u0151i eszk\u00f6z\u00f6k<\/strong> a megjelen\u0151 men\u00fcben.\n<\/p>\n

      <\/p>\n<\/li>\n

    5. \n

      \nMegny\u00edlik egy ablak, amely az ablakt\u00e1bla bal oldal\u00e1n a HTML forr\u00e1sk\u00f3dot, a jobb oldalon pedig a kapcsol\u00f3d\u00f3 CSS-t mutatja.\n<\/p>\n<\/li>\n

    6. \n

      \nAlternat\u00edv megold\u00e1sk\u00e9nt, ha jobb gombbal kattint egy elem egy weblapon<\/strong> \u00e9s v\u00e1lassza ki a Ellen\u0151riz<\/strong> a megjelen\u0151 men\u00fcb\u0151l a Chrome fejleszt\u0151i eszk\u00f6zei felbukkannak, \u00e9s kiemelik a HTML-ben kiv\u00e1lasztott r\u00e9szt, a megfelel\u0151 CSS-sel jobbra. Nagyon hasznos, ha t\u00f6bbet szeretne megtudni a webhely egy adott darabj\u00e1r\u00f3l.\n<\/p>\n<\/li>\n<\/ol>\n

      Jogos a forr\u00e1sk\u00f3d megtekint\u00e9se? <\/h2>\n

      \nAz \u00e9vek sor\u00e1n sok \u00faj webdesignernek feltett\u00fck a k\u00e9rd\u00e9s\u00e9t, hogy elfogadhat\u00f3-e egy webhely forr\u00e1sk\u00f3dj\u00e1nak megtekint\u00e9se \u00e9s felhaszn\u00e1l\u00e1sa az oktat\u00e1sukhoz \u00e9s v\u00e9gs\u0151 soron az \u00e1ltaluk v\u00e9gzett munk\u00e1hoz. B\u00e1r a webhely nagykereskedelmi m\u00e1sol\u00e1sa \u00e9s a saj\u00e1tk\u00e9nt t\u00f6rt\u00e9n\u0151 \u00e1tad\u00e1sa a weboldalon biztosan nem elfogadhat\u00f3, ennek a k\u00f3dnak az ugr\u00f3deszkak\u00e9nt val\u00f3 haszn\u00e1lata, hogy megtanulj\u00e1k, val\u00f3j\u00e1ban h\u00e1ny el\u0151rel\u00e9p\u00e9s t\u00f6rt\u00e9nt ebben az ipar\u00e1gban.\n<\/p>\n

      \nAmint azt a cikk elej\u00e9n eml\u00edtett\u00fck, neh\u00e9z lenne megtal\u00e1lni egy m\u0171k\u00f6d\u0151 webes szakembert, aki ma nem tanult meg valamit a webhely forr\u00e1sainak megtekint\u00e9s\u00e9vel! Igen, a webhely forr\u00e1sk\u00f3dj\u00e1nak megtekint\u00e9se t\u00f6rv\u00e9nyes. A k\u00f3d er\u0151forr\u00e1sk\u00e9nt t\u00f6rt\u00e9n\u0151 haszn\u00e1lata hasonl\u00f3 l\u00e9trehoz\u00e1s\u00e1hoz szint\u00e9n biztons\u00e1gos. Ha a k\u00f3dot aktu\u00e1lis \u00e1llapotban veszi \u00e1t, \u00e9s tov\u00e1bbadja, mivel a munk\u00e1ja sor\u00e1n probl\u00e9m\u00e1kat okoz.  \n<\/p>\n

      \nV\u00e9g\u00fcl a webes szakemberek tanulnak egym\u00e1st\u00f3l, \u00e9s gyakran jav\u00edtj\u00e1k azt a munk\u00e1t, amelyet l\u00e1tnak \u00e9s inspir\u00e1lnak, ez\u00e9rt ne habozzon megn\u00e9zni a webhely forr\u00e1sk\u00f3dj\u00e1t \u00e9s haszn\u00e1lni azt tanul\u00e1si eszk\u00f6zk\u00e9nt.\n<\/p>\n

      T\u00f6bb, mint HTML <\/h2>\n

      \nEgy dologra eml\u00e9kezni kell arra, hogy a forr\u00e1sf\u00e1jlok nagyon bonyolultak lehetnek (\u00e9s min\u00e9l \u00f6sszetettebb a megtekintett webhely, ann\u00e1l \u00f6sszetettebb val\u00f3sz\u00edn\u0171leg a webhely k\u00f3dja). Az oldalt alkot\u00f3 HTML strukt\u00fara mellett lesznek CSS (l\u00e9pcs\u0151zetes st\u00edluslapok) is, amelyek meghat\u00e1rozz\u00e1k az adott oldal vizu\u00e1lis megjelen\u00e9s\u00e9t. Ezenk\u00edv\u00fcl sok webhely ma a HTML-hez mell\u00e9kelt szkriptf\u00e1jlokat is tartalmaz.\n<\/p>\n

      \nVal\u00f3sz\u00edn\u0171leg t\u00f6bb szkriptf\u00e1jlt is tartalmaz; val\u00f3j\u00e1ban mindegyik a webhely k\u00fcl\u00f6nb\u00f6z\u0151 aspektusait t\u00e1pl\u00e1lja. \u0150szint\u00e9n sz\u00f3lva, egy webhely forr\u00e1sk\u00f3dja els\u00f6pr\u0151nek t\u0171nhet, k\u00fcl\u00f6n\u00f6sen, ha m\u00e9g nem ismeri ezt. Ne csal\u00f3djon, ha nem tudja azonnal kital\u00e1lni, mi folyik az adott webhelyen. A HTML forr\u00e1s megtekint\u00e9se csak az els\u0151 l\u00e9p\u00e9s ebben a folyamatban. Kis tapasztalat birtok\u00e1ban jobban meg fogja \u00e9rteni, hogy ezek a darabok hogyan illeszkednek egym\u00e1shoz, hogy l\u00e9trehozz\u00e1k azt a weboldalt, amelyet a b\u00f6ng\u00e9sz\u0151ben l\u00e1t. Amint jobban megismeri a k\u00f3dot, t\u00f6bbet tudhat meg bel\u0151le, \u00e9s ez nem t\u0171nik olyan ijeszt\u0151nek az \u00d6n sz\u00e1m\u00e1ra.<\/p>\n","protected":false},"excerpt":{"rendered":"

      F\u00fcggetlen\u00fcl att\u00f3l, hogy \u00faj vagy-e a webiparban vagy tapasztalt veter\u00e1n, a k\u00fcl\u00f6nb\u00f6z\u0151 weboldalak HTML-forr\u00e1sainak megtekint\u00e9s\u00e9vel val\u00f3sz\u00edn\u0171leg sokszor foglalkozol majd karriered sor\u00e1n. A legt\u00f6bb b\u00f6ng\u00e9sz\u0151 lehet\u0151v\u00e9 teszi a forr\u00e1s egyszer\u0171 megtekint\u00e9s\u00e9t; A Chrome sem k\u00fcl\u00f6nb\u00f6zik ett\u0151l. A webhely forr\u00e1sk\u00f3dj\u00e1nak megtekint\u00e9se az egyik legegyszer\u0171bb m\u00f3dja annak, hogy tanuljon az adott munk\u00e1b\u00f3l, \u00e9s elkezdjen konkr\u00e9t k\u00f3dot vagy technik\u00e1kat … Olvass tov\u00e1bb<\/a><\/p>\n","protected":false},"author":884,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[],"class_list":["post-1871","post","type-post","status-publish","format-standard","hentry","category-wiki"],"_links":{"self":[{"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/posts\/1871","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/users\/884"}],"replies":[{"embeddable":true,"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/comments?post=1871"}],"version-history":[{"count":0,"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/posts\/1871\/revisions"}],"wp:attachment":[{"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/media?parent=1871"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/categories?post=1871"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/megnyitasa.com\/blog\/wp-json\/wp\/v2\/tags?post=1871"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}