زالیزو

کلیدهای داغ برای باز کردن کد جانبی. چگونه به کد خروجی یک صفحه در گوگل کروم نگاه کنیم

ومینیا کد خروجی صفحه را تغییر دهید– یک korisna navichka برای کاربر مرفه اینترنت. علاوه بر جایگزینی کد HTML، می توانید صفحه وب باز شده را به دلخواه تغییر دهید. این آمار واضح است، نحوه تغییر کد صفحهاز گوگل کروم با این حال، در سایر مرورگرها همه چیز به همین صورت کار می کند، بنابراین هیچ مشکلی وجود ندارد.

کد HTML صفحه جانبی چیست؟

صفحه ای که در مرورگر خود باز می کنید حاوی کد نشانه گذاری HTML شما است. این کد برچسب و متن است. برچسب ها نشانگرهایی هستند که به مرورگر می گویند چگونه قسمت خاصی از سایت را نمایش دهد. متن آخرین قسمت صفحه است، قسمتی که کاربر باید بخواند. همچنین، سبک های CSS را می توان به صفحه اضافه کرد تا ظاهر عناصر صفحه را تنظیم کند. شچوب کد خروجی وب سایت را تغییر دهیدشما نیازی به دانستن کامل HTML و CSS ندارید و به زودی با آن آشنا خواهید شد.

آیا زمان آن رسیده که صفحه وب خود را تغییر دهید؟

می توانید داده های سایت را تغییر دهید، متن اعلان را تغییر دهید یا یک اسکرین شات جعلی ایجاد کنید. لطفاً اطمینان حاصل کنید که همه تغییرات برای شما قابل مشاهده نیستند و هنگامی که مجدداً صفحه را وارد می کنید ظاهر نمی شوند. همچنین، تغییرات داده ها واقعی نخواهد بود. به عنوان مثال، اگر من 10 دلار داشته باشم و آن را به 100 تغییر دهم، دیگر هیچ پنی نخواهم داشت. یعنی مرورگر صفحه را نمایش نمی دهد. باسن:

پست:

به عنوان مثال، من این سایت را می گیرم و اعلان جلوی مقاله را تغییر می دهم "" صفحه اصلی را در Google Chrome باز کنید. روی عنصری که می‌خواهم تغییر دهم کلیک راست می‌کنم، مثلاً عنوان اعلامیه را انتخاب می‌کنم و «مشاهده کد» را انتخاب می‌کنم.

در پنجره، به تب Elements بروید و کد HTML صفحه را وارد کنید. کسی باید متنی را که برای ما مهم است بداند. (مکمل با کرم)

اکنون می توانم متن قدیمی را ببینم و در متن جدید بنویسم.

محور و تمامی اسامی اطلاعیه تغییر یافته است. اکنون خود اعلامیه، برچسب ها و بخش را خراب می کنم.

با تغییر ویژگی src در عنوان img می توانید تصویر دیگری را وارد کنید.

1 رای

صبح بخیر، دوستان خوانندگان وبلاگ من. ممکن است یک ترفند عالی در سایت پیدا کنید و شروع به نگرانی در مورد چگونگی دستیابی به چنین اثر عالی کنید.

معلوم می شود که دانستن پاسخ آسان است. و اگر دانش اولیه ای دارید، می توانید مجموعه ای از این ترفندها را انتخاب کنید و وب سایت منحصر به فرد خود را در یک ساعت کوتاه ایجاد کنید.

امروز در مورد نحوه باز کردن قفل کد صفحه، عنصر آهنگ و یادگیری استفاده از این مهارت به نفع خود صحبت خواهیم کرد.

دانش اولیه در مورد کد

سایت من برای تازه واردان است و می خواهم چند کلمه در مورد سایت ها و به طور کلی کد بدانم.

برای کشیدن یک تصویر، سپس آن را به قسمت های کوچکتر برش دهید، کد بنویسید تا هر مرورگری دوباره تمام عناصر را در یک مکان جمع کند. آیا همه چیز خیلی پیچیده به نظر می رسد؟ به هیچ وجه، خلاصه کردن این درایو خوب نیست.

برخی از سایت ها دقیقاً به همین شکل ایجاد می شوند. اگر می خواهید، در سمت راست وارد شوید و منتظر بمانید، نیازی به نگرانی نیست - هیچ کس نمی تواند شما را اذیت کند.

من فقط یک چیز را می گویم ... هیچ چیز خوبی در مورد آن وجود ندارد، به جز این که کلمات ناخودآگاهی که نوشته اید به یک کل تبدیل می شوند و جان می گیرند: پیام ها کار می کنند، دکمه ها در حال فرو ریختن هستند، تصاویر در حال فرو ریختن هستند، متن در حال حرکت است من فکر می کنم که می دانم، همانطور که ویکتور فرانکنشتاین را احساس کردم.

وقتی شروع به درک زبان تاریک کردید و متوجه شدید که همه چیز واقعاً ساده‌تر است، آنقدر ساده به نظر می‌رسید که نمی‌توانید قدرت و توانایی مغز را باور نکنید. خیلی باحاله

چگونه از سایت دوری کنیم؟ در حالت ایده آل، متوقف خواهم شد. وین به سادگی نقاشی می کند. به عنوان مثال، همانطور که در نوزاد زیر نشان داده شده است. در حال حاضر نه تصویری وجود دارد، نه عکاسی. پیام را اجرا نکنید، با فشار دادن، به جایی نروید، جستجو کار نخواهد کرد.

برای این کوچولو به اسکرین شات زیر نگاهی بیندازید. ممکن است فکر کنید که این مجموعه ای ساده و پیچیده از شخصیت ها است. در واقعیت، همه چیز دیگر چندان پیچیده نیست، یک الگوریتم ساده وجود دارد.

حدود 150 تگ وجود دارد و پوسته های آنها نشان دهنده آهنگ است: ارسال شده، منتقل شده، نشان داده شده به صورت پررنگ، رنگ، عنوان و غیره. بازگشت به آنها چندان دشوار نیست، زیرا لازم است و در هر زمان نیست.

شناخت این صفات عملاً در هر شرایطی قابل دستیابی است. محور تنها مسیری که در پشت دسترسی به پوست پوست است این است که خودشان را بشناسند.

سازندگان ماهر باید سخت تلاش کنند تا به نتیجه برسند، در حالی که دیگران باید فکر کنند، شواهدی را از مقالات و کد خروجی رقبا جستجو کنند. شما فقط باید قسمت لازم را از یک سایت شخص ثالث بردارید و آن را برای خود ویرایش کنید. این به طور قابل توجهی روند کار را سرعت می بخشد.

به زودی، یک باسن خاص را به شما نشان خواهم داد.

بررسی کد

پدر، اجازه دهید فوراً به شما نشان دهم که چگونه این کار را انجام دهید، اگر لازم است html شخص دیگری را تشخیص دهید. سپس نگاهی دقیق تر به سایر غذاها خواهیم داشت.

بهترین راه

روشی که برای اولین بار توضیح خواهم داد، برای مبتدیان کمی ساده است، اما به خاطر آگاهی - ادامه دهید، بخوانید. صفحه را باز کنید و دکمه سمت راست ماوس را فشار دهید. مورد «ذخیره به عنوان…» را انتخاب کنید

از وب سایت به طور کامل محافظت کنید. همانطور که از اسکرین شات می بینید، من قبلاً همه چیز را از دور گرفته ام. در اینجا دو پوشه داریم.

هر چیزی که نیاز دارید اینجاست. عنصر چرمی. اگر می دانید چیست، می توانید به سرعت از هر چیزی که نیاز دارید اجتناب کنید. و با این حال، بیابان به طور فزاینده ای در حال بیابان شدن است. دانلود کار نخواهد کرد. اگر از کپی کناری مسدود شد چه باید کرد؟

Tse f Google chrome

همانطور که قبلاً متوجه شده اید، من بیشتر از Google Chrome استفاده می کنم و پیدا کردن کد شخص دیگری در مرورگر شما به آسانی پوست اندازی گلابی است. به عنوان یک اصل و به هر شکل دیگری. این طرح مشابه نخواهد بود، اما یکسان خواهد بود. صفحه ای را که می خواهیم کد آن را تشخیص دهیم باز می کنیم و با دکمه سمت راست ماوس روی هر مکانی کلیک می کنیم. در پنجره ای که ظاهر می شود، روی «مشاهده کد صفحه» کلیک کنید.

یک پنجره جدید به کدی باز می شود که شروع با آن برای افراد تازه کار دشوار است. ایول، زود فریاد نزن.

اگر نیاز به تشخیص کد فقط برای یک عنصر دارید، فقط ماوس را به سمت آن بگیرید و روی کلید سمت راست کلیک کنید. ما عملکرد دیگری را برای Chrome انتخاب می کنیم: "بازبینی کد عنصر".

به عنوان مثال، اگر تصاویر یا برنامه نویسی زبان را انتخاب می کنید، ممکن است مهم باشد که بدانید لوگو چگونه تقسیم می شود؟ همچنین می توانید با استفاده از CSS اضافی یک مربع ایجاد کنید. تعداد زیادی جعلی وجود دارند که می خواهند بیشترین اطلاعات را در کد بنویسند. چگونه در سایت های محبوب کار کنیم؟

Axis و اطلاعات مورد نیاز ظاهر شده است. HTML در بالا، CSS در پایین. در اینجا دو فیلم وجود دارد. اولین مورد وظیفه ذخیره سازی متن و دیگری برای طراحی است. اگر CSS نداشتید، باید فوراً رنگ و اندازه فونت را مشخص کنید. برای قسمت پوست ماندگاری بیشتری دارد. اگر html نداشتید، پس ما متن کافی نداشتیم. تقریباً توضیح می دهم، اما همه چیز اینگونه است.

قبل از صحبت کردن، اگر به تأثیرات زیادی در اینجا علاقه مند شده اید، می توانید تصویر زیر را تحسین کنید. این شهادت من برای شماست.

موزیلا فایرفاکس

اگر دوست دارید در پماد تمرین کنید، پس همه چیز یکسان خواهد بود. صفحه را باز کنید و دکمه ماوس را در سمت راست فشار دهید. اگر می‌خواهید همه کدها را با جزئیات ببینید، "کد خروجی داستان".

هنگامی که ماوس را روی یک عنصر قرار می دهید، می توانید کد آن را باز کنید.

در اینجا داده ها در قسمت پایین صفحه نمایش داده می شوند، اما در غیر این صورت همه چیز یکسان است.

مرورگر Yandex

در مرورگر Yandex همه چیز مانند دو گزینه اول است، صفحه را باز کنید، کلیک راست کنید و کد صفحه ظاهر می شود.

اگر بخواهیم کد آن عنصر را تشخیص دهیم، مکان نما را روی عنصر حرکت می دهیم.

همه چیز در اینجا مانند کروم ظاهر می شود.

اپرا

خب بالاخره اپرا

شاید قبل از سخنرانی اشاره کردید که هدف شدن واجب نیست. برای باز کردن کد، از کلید یکسان و برای همه مرورگرها استفاده کنید، اما: CTRL+U.

برای عناصر: Ctrl+Shift+C.

نتیجه به نظر می رسد این است.

این برای تازه واردان عالی خواهد بود

و اکنون می توانید از نحوه عملکرد همه چیز شگفت زده شوید. سایت را پیدا کنید و برخی از عناصر را دوست خواهید داشت. به عنوان مثال، محور. شما قبلاً می دانید که چگونه رمز عنصر را باز کنید.

حالا شما کپی کنید

من در حال سرگردانی هستم، این کد را در یک فایل html جدید، در تگ body (به زبان انگلیسی) وارد می کنم.

اکنون ما از اینکه چگونه همه چیز در مرورگر به نظر می رسد شگفت زده خواهیم شد.

آماده. برای اینکه متن در اطراف لبه ها تراز شود و رنگ سبز حذف شود، باید css را در این سند قرار دهید و کدهای دیگر را از وب سایتی که از آن کپی می کردید کپی کنید.

من فعلا قیم را نمی پذیرم. این بیش از یک ساعت طول می کشد: هم مال من و هم مال شما. فکر می کنم تمام جزئیات را در انتشارات آینده خود شرح خواهم داد. در خبرنامه مشترک شوید و اولین کسی باشید که از ظاهر مقاله مطلع می شود.

از آنجایی که من قدرت تحمل را ندارم و می‌خواهم در حال حاضر درباره HTML و CSS بیشتر بیاموزم، طبق سنت می‌توانم دوره‌های اولیه بدون هزینه را توصیه کنم.

در اینجا 33 درس وجود دارد که می توانید به آنها مسلط شوید “دوره آموزشی رایگان با HTML” .

و در اینجا اطلاعات بیشتری در مورد css وجود دارد. "دوره رایگان با CSS (45 درس ویدیویی!)" .

حالا شما کمی بیشتر می دانید. برای شما آرزوی موفقیت در تلاش دارم. تا زسترچ جدید!

لازم است بدون تداخل با فایل ها و کدهای سایت ارسال شده در اینترنت، تمامی تغییرات روی خود سایت به سرعت بررسی شود. به عنوان مثال، طرح رنگ هر بلوکی را تغییر دهید، عنصری را که حذف شده است وارد کنید و غیره.

برای این منظور، بسیاری از وب مسترها از سرورهای محلی Denwer یا OpenServer استفاده می کنند و یک نسخه جدید از سایت را روی رایانه خود راه اندازی می کنند. این روش جهانی و برای حرفه ای ها مناسب است، علاوه بر این می توانید کار اسکریپت ها و پلاگین های مختلف را بررسی کنید، تغییر طرح را آزمایش کنید و تمامی فایل ها را در سایت ویرایش کنید و پس از تست تغییرات روزانه خود را مستقیماً به وب سایت منتقل کنید.

برای کسانی که از وب مسترها دور هستند، توصیه می کنم از یک مرورگر برای این اهداف استفاده کنند. از آنجایی که من از Chrome استفاده می کنم، دستورالعمل هایی را همراه با اسکرین شات برای مرورگر شما ارائه خواهم کرد. یک قیاس را می توان با مرورگرهای Opera، Yandex Browser، Mozilla Firefox و سایر مرورگرها استفاده کرد، اصل ابزارهای آنها مشابه است.

دستورالعمل 1: نحوه مشاهده کل کد HTML یک وب سایت در یک مرورگر

با این کار یک صفحه وب ضروری برای سایت شما باز می شود. با کلیک راست بر روی عنصر مورد نیاز، یک منوی زمینه مرورگر با دستورات موجود ظاهر می شود:

Malyunok 1. بررسی تمام کدهای HTML صفحه وب در مرورگر کروم

مهم:دستورات منویی که ظاهر می شوند می توانند متفاوت باشند، به عنوان مثال، برای عناصر فعال (پیام ها، تصاویر، فیلم ها) و غیر فعال (متن، پس زمینه، ویدئو):

شکل 2. منوی مرورگر کروم که ظاهر می شود

اگر دستور مورد نیاز را پیدا نکردید، فقط دکمه سمت راست ماوس را در مکانی دیگر فشار دهید یا از کلیدهای میانبر مرورگر استفاده کنید.

بیایید به کوچک 1 برگردیم، دستور لازم برای بررسی تمام کدهای HTML صفحه وب خروجی را نشان می دهد، به نام " بررسی کد صفحه". روی دستور کلیک کنید، یک تب جدید با همان کد برای صفحه وب خروجی باز می شود، یک امتیاز عالی برای همه نماهای موجود با نحو صحیح:

Malyunok 3. بخشی از کد این سایت

این ابزار به ویژه برای یافتن و ویرایش عناصر مختلف مفید است.

روش های جایگزین برای بررسی تمام کدهای HTML یک صفحه وب

برای دسترسی بیشتر می توانید از راه های دیگری برای دسترسی به این ابزار استفاده کنید.

  1. در Baby 1 همچنین مهم است که این دستور در پشت یک کلید اضافی موجود باشد + ;
  2. درج منبع view در نوار آدرس مرورگر: سایت به جای دامنه، آدرس خود را وارد کنید.

هر دو روش جهانی هستند و برای همه مرورگرها کاربرد دارند.

من شروع به فکر می کنم که این ابزار اصلاً مورد نیاز نیست، اما نگاه کردن به تمام کدهای HTML یک سایت برای جستجوی کد عناصر ضروری، که ممکن است شامل تگ ها، متا تگ ها، ویژگی ها و عناصر دیگر باشد، عالی است.

کلیدهای میانبر جدید +نگاه کنید، در مرورگر کروم در بالای دست راست ظاهر می شود:

Malyunok 3. کد را در سایت جستجو کنید

پس از وارد کردن فرم جستجو، صفحه به اولین عنصر یافت شده منتقل می شود، با استفاده از فلش ها می توانید بین آنها حرکت کنید و مورد نیاز خود را انتخاب کنید:

Malyunok 4. کد HTML سایت را جستجو کنید

دستورالعمل 2: نحوه مشاهده و ویرایش کدهای HTML و CSS برای یک وب سایت در مرورگر Google Chrome

اکنون مهم ترین بخش است که در آن به شما نشان خواهم داد که چگونه می توانید کد HTML و CSS یک وب سایت را در مرورگر ویرایش کنید. سپس تغییرات را به مرورگر منتقل کنید.


از آنجایی که این ابزار همیشه در مرورگر شما موجود است، دستورات دیگر را آزمایش کنید تا ویرایش سایت را آسان‌تر کنید.

ما کتاب جدیدی با عنوان «بازاریابی محتوا در رسانه‌های اجتماعی: چگونه وارد ذهن پیش‌پرداخت‌کنندگان شوید و آنها را با نام تجاری خود اشتباه بگیرید» منتشر کرده‌ایم.

اشتراک در

کد خروجی برای سایت ترکیبی از نشانه گذاری HTML، سبک های CSS و اسکریپت های جاوا اسکریپت است که مرورگر به عنوان یک وب سرور تفسیر می کند.

ویدیوهای بیشتر در کانال ما - بازاریابی اینترنتی را از SEMANTICA یاد بگیرید

این را می توان با مجموعه دستوراتی که فرمانده به سربازان می دهد توضیح داد. واضح است که نظاره گرها بوی رئیس را نمی دهند. از نقطه نظر آنها، ارتش می تواند به طور مستقل اقداماتی را انجام دهد. در مورد ما، فرمانده مرورگر است، دستورات کد خروجی هستند و سربازانی که رژه می روند نتیجه نهایی هستند.

سایت بر روی یک وب سرور ذخیره می شود که به سایت اجازه می دهد تا توسط کاربر استفاده شود. با وارد کردن URL در ردیف آدرس، کلیک کردن یا کلیک کردن بر روی دکمه ارسال داده در فرم از شما خواسته می شود. فرقی نمی کند که چه نوع داستان وب را می نویسم یا بخش نرم افزار را شامل می شود. نتیجه نهایی هر الگوریتم سرور، تایپ تگ ها و متن های html است.
کد خروجی صفحه مجموعه ای از داده ها است که شامل:

  • html-layout;
  • شیوه نامه یا سفارشی سازی برای فایل؛
  • برنامه هایی که با جاوا اسکریپت نوشته شده اند یا با کد به فایل ها ارسال می شوند.

این سه بخش توسط مرورگر پردازش می شوند. برای سرور، این فقط متنی است که باید به درخواست ارسال شود.

حالا باید کد خروجی را وارد کنیم

هر چیزی که برای ما مهم است را می توان تجزیه و تحلیل و حل کرد تا این موارد و موارد دیگر را که در طول کار در سایت به خصوص در فرآیند بهینه سازی ایجاد می شود بهبود بخشد. با نگاهی به کد خروجی، می توانیم:

  • تگ های متا را به سایت خود یا شخص دیگری برای تجزیه و تحلیل آنها اضافه کنید.
  • نمایان بودن و وجود عناصر خاصی را در سایت بررسی کنید: پزشکان، کدهای شناسایی در سیستم های مختلف، اسکریپت های قدیمی و غیره.
  • در مورد پارامترهای عناصر: اندازه، رنگ، فونت اطلاعات کسب کنید.
  • مسیرهای عکس و سایر عناصر را در سایت پیدا کنید.
  • پیام موجود در صفحه را بخوانید.
  • مشکلات کد را که بر روند بهینه سازی سایت تأثیر می گذارد پیدا کنید: سبک ها، اسکریپت ها، کد نامعتبر.

اساساً، اگر فقط کد را بخوانید، می توانید اطلاعات بیشتری در مورد صفحه بیاموزید.

نحوه مشاهده کد خروجی سایت

به طور کلی، به نظر می رسد که مهم نیست که چگونه روی سرور واریز کنید، نمی توانید از مرورگر درآمد کسب کنید. و می توانید با فشار دادن دکمه ماوس در سمت راست کل طرح را افزایش دهید. اینجا و آنجا در برنامه Google Chrome.

گزینه «بازبینی کد صفحه» را انتخاب کنید و فهرست جدید را در همان سپرده انتخاب کنید.

این فقط یک متن است که برای درک آن باید تحلیل شود. و می توانید کد تعاملی را با استفاده از ابزارهای اضافی از توسعه دهنده استخراج کنید.

نحوه پیدا کردن کد خروج از صفحه وب سایت

روی نماد منو در مرورگر کلیک کنید. بیشتر اوقات، شما راست دست هستید و دید سه نقطه ای یا کناری دارید.

در بخش ابزارهای اضافی، «ابزار خرده‌فروش» را انتخاب کنید.

پنجره ای باز می شود که کد فعال را نشان می دهد. این بدان معنی است که وقتی ماوس را روی طرح بندی فشار می دهید، سبک عنصر ظاهر می شود و بلوک های انتخاب شده در کنار برجسته می شوند.

در برگه "منبع" می توانید فایل های مختلفی را مشاهده کنید: اسکریپت ها، فونت ها، تصاویر.

برگه امنیت به شما امکان می دهد گواهی سایت را تأیید کنید.

برگه حسابرسی به شما کمک می کند تا آنچه را که در منبع میزبانی آپلود شده است تأیید کنید.

اگر نمی توانید پانل سمت راست را به صورت دستی حرکت دهید، می توانید سه نقطه را فشار داده و با انتخاب مورد مناسب آنها را تغییر دهید.

چگونه از متا تگ ها شگفت زده شویم

سند HTML شامل تگ های ساختاری است. اقدامات محور از آنها:

  1. Html - کل سند.
  2. سر - بخش سرفصل های سرویس.
  3. عنوان – عنوان صفحه (نمایش داده شده در برگه).
  4. بدن - بدنه سند.
  5. H1-H6 - سرفصل های متن کناری.
  6. مقاله - مقاله.
  7. بخش - تقسیم.
  8. منو - منو.
  9. Div - بلوک.
  10. دهانه - ردیف.
  11. پ – پاراگراف
  12. میز – میز.

عناصر برای تقسیم منطقی بخش ها در صفحه در صورت لزوم طراحی شده اند، آنها با استفاده از سبک های اضافی طراحی می شوند. آنها حاوی متنی هستند که در غیر این صورت در صفحه قابل مشاهده است. همچنین در قسمت سر اطلاعات سرویس وجود دارد. برای این درج متا تگ ها وجود دارد. هر آنچه در آنها ضبط می شود برای سرور و سیستم های صوتی در نظر گرفته شده است.

به هیچ وجه نمی توان به این نتیجه رسید.

من برای تگ لینک احترام زیادی قائلم. این به شما کمک می کند تا پیام های ارسال شده به فایل های خارجی که در حال اتصال هستند را سفارش دهید. در صورت تمایل، می توانید آن را به جای آن ذخیره کرده و در دیسک ذخیره کنید. برای انجام این کار، رجیستر را به آدرس نشان داده و RMB را فشار دهید. Open in new Tab را انتخاب کنید.

سپرده جدید فایلی را باز می کند که می توانید آن را مشاهده و ذخیره کنید.

نحوه دیدن کد خروجی صفحه برای بهبود اسکریپت

در این حالت، باز کردن صفحه در ماشین محلی آسان تر است. اگر فقط نیاز به اصلاح طرح، سبک و اسکریپت دارید، می توانید مستقیماً از پوشه کار کنید. کد HTML را می توان دقیقاً مانند آن مشاهده کرد. و خط فرمان برای کد جاوا اسکریپت از تب Console قابل دسترسی است. در اینجا شرحی از ترتیب و شماره ردیفی که در آن نوشته شده است را نشان می دهد.

نحو را می توان در هر نقطه از کد بهبود بخشید. این به تب "منبع" اختصاص داده شده است.

چگونه از رمز یک عنصر خاص شگفت زده شویم

برای صفحات بزرگ با تعداد عناصر زیاد، دانستن کد مورد نیاز برای همه طرح‌بندی‌ها دشوار است. در این حالت، می توانید با استفاده از یک دستور خاص در منوی زمینه، روند را تسریع کنید. اجازه دهید ماوس را به سمت قطعه گرفته و RMB را فشار دهید. دستور "بازبینی کد" را وایبر کنید.

همان پنجره ظاهر می شود، اما روی شی انتخاب شده تمرکز کنید.

خلاصه

ما متوجه شدیم که این کد خروجی صفحه است. کافی است به دانش اولیه HTML و CSS تسلط داشته باشید و با استفاده از ابزارهای دستی توسعه دهنده می توانید اسناد HTML خود را بهبود ببخشید.

بررسی کد منابع در اینترنت به شما این امکان را می دهد که نه تنها در دانش عمومی شروع کنید، بلکه برنامه های واقعی را نیز کشف کنید. و برای متخصصان سئو متا تگ های مفیدی وجود خواهد داشت، اطلاعاتی که در آنها می توانید چیزهای زیادی در مورد سایت بگویید.

برای مدت طولانی، گزینه "نمایش کد خروجی صفحه" بی فایده بود. تا کنون، توسعه HTML در Codecademy و طرح‌بندی سایت‌های رسمی به احتکار جدید من تبدیل نشده است. اینجاست که غذا وارد می‌شود: کجا می‌توانید موارد واقعی را پیدا کنید و راه‌حل‌های مؤثر را برای «خزانه» خود ذخیره کنید؟ پاسخ فوق العاده ساده بود، مثل همه چیز مبتکرانه: به کد خروجی صفحه در گوگل کروم نگاه کنید! یافته های متواضعانه ام را با شما به اشتراک می گذارم.

کد خروجی صفحه چیست؟

اگر شما هم مثل من فقط مراحل اول را در برنامه نویسی HTML کار می کنید، نمی دانیم کد خروجی صفحه چیست.

کد خروجی، در کد HTML صفحه - متن در Movi Hyper Text Markup Language (HTML). این شامل محتوای صفحه (متن، جداول) و برچسب ها است. بقیه نقش دستورالعمل‌های مرورگر را بازی می‌کنند: چگونه محتوا را نمایش دهیم، چه قالبی را قالب‌بندی کنیم، کجا لینک یا فایل رسانه را وارد کنیم. خوب، برای ما، برنامه نویسان تازه کار، کد خروجی بهترین زمینه برای شروع است: می توانیم یک سایت خوب پیدا کنیم و قطعات را تماشا، ذخیره و vikorista کنیم. یاک؟

چگونه به کد خروجی در کنار مرورگر گوگل کروم نگاه کنیم

ما یک طرف مناسب را می شناسیم. به عنوان مثال، من تحت تاثیر طراحی منوی وب سایت قرار نگرفتم. سه راه برای باز کردن کد خروجی در مرورگر گوگل کروم وجود دارد:

  1. روی انتها کلیک کنید منودر گوشه سمت راست بالای مرورگر، مورد «ابزارهای اضافی» را انتخاب کنید. از جمله گزینه "نمایش کد خروجی" است. می دانید، این روش به ندرت استفاده می شود: رازهای زیادی وجود دارد. شما می توانید آن را حتی ساده تر انجام دهید.
  2. کلید ترکیبی را فشار دهید Ctrl+U- یک پنجره جدید با کد خروج باز می شود.
  3. برای طرفداران منوی زمینه: روی صفحه کلیک راست کرده و گزینه "مشاهده کد صفحه" را انتخاب کنید.

کد HTML صفحه در مرورگر خراب است. بیایید به مرحله بعدی برویم.

نحوه ویرایش و ذخیره کد خروجی

شما باید یاد بگیرید که چگونه یک وب سایت ایجاد کنید، اما خواندن کد HTML شخص دیگری کافی نیست. شما باید با آن بازی کنید، آزمایش کنید، تغییراتی ایجاد کنید و نتیجه را بررسی کنید. می توانید از مجموعه ای از چند کلمه دور شروع کنید. چگونه می توانم کد خروجی را ویرایش و ذخیره کنم؟

گزینه 1. "دستی"

پس از باز کردن کد خروجی صفحه، روی منوی زمینه کلیک کنید و گزینه "Save as" را انتخاب کنید و فایل را در هارد دیسک خود ذخیره کنید. فایل را می توان در Notepad یا Notepad ویرایش کرد، تغییرات را می توان از طریق مرورگر ذخیره و باز کرد. نتایج تغییرات ما (از راه دور یا نه) در پنجره مرورگر نمایش داده می شود.

گزینه 2. برای حرفه ای ها

اگر امروز با کد خروج بازی کنید، فرآیند "ذخیره - باز کردن - تغییر - ذخیره - تجدید نظر" خسته کننده می شود. برای خودم، با نصب یک افزونه برای Google Chrome - Firebug Lite راه حلی پیدا کردم. این امکان را به شما می دهد تا کد خروجی را بدون خروج از پنجره مرورگر ویرایش و ذخیره کنید.