Developer Tools ашиглан Google Chrome дээр хэрхэн дэлгэцийн зураг авах вэ

Агуулгын хүснэгт:

Developer Tools ашиглан Google Chrome дээр хэрхэн дэлгэцийн зураг авах вэ
Developer Tools ашиглан Google Chrome дээр хэрхэн дэлгэцийн зураг авах вэ
Anonim

Юу мэдэх вэ

  • Компьютер дээр: Ctrl + Shift + I дараа нь Ctrl + Shift P дарна уу.
  • Mac: Command + Option + I дараа нь Command + Shift P дарна уу.
  • Дараа нь дэлгэцийн зургийн дөрвөн сонголтыг харахын тулд "дэлгэцийн агшин" гэж бичнэ үү.

Энэ нийтлэлд хөгжүүлэгчийн хэрэгслийг ашиглан Chrome-д дэлгэцийн агшинг хэрхэн авах талаар тайлбарласан болно.

Дэлгэцийн агшин авахын тулд Chrome-ын хөгжүүлэгчийн хэрэгслийг хэрхэн ашиглах вэ

Дэлгэц хэвлэх товчлуур болон Chrome хэрэглүүрийг ашиглах хоёрын ялгаа нь Chrome-ын дэлгэцийн зургийн хэрэгсэл нь Chrome хөтчийн цонхны хүрээг агуулаагүй, зөвхөн вэб хуудасны агуулгыг агуулдагт оршино. Хэрэв та дэлгэцийн агшингаа засварлахгүйгээр зөвхөн хуудасны агуулгыг авахыг хүсвэл хөгжүүлэгчийн хэрэгслүүд танд нэг алхам хэмнэх боломжтой.

Та хөгжүүлэгчийн хэрэгсэлд хандахын тулд цэс эсвэл гарын товчлолыг ашиглаж болно.

  1. Компьютер дээр Ctrl + Shift + I, Mac дээр Command + Option + I дарна уу. Эсвэл гурван цэгтэй цэсийн дүрс дээр товшоод Дэлгэрэнгүй хэрэгсэл > Хөгжүүлэгчийн хэрэгслүүд Үүнийг хийснээр вэб хуудасны цэсийг харуулдаг Element Inspector хөгжүүлэгч цэс нээгдэнэ. HTML кодчилол.

    Image
    Image
  2. Дараа нь Ctrl + Shift P (PC) эсвэл Command + Shift P (Mac) эсвэл гурван цэгтэй цэсийг дарна уу. Өөрчлөх ба удирдах DevTools-д зориулж RunCommand-г сонгоно уу.

    Image
    Image

    Зөвхөн энгийн эсвэл бүрэн хэмжээний дэлгэцийн агшин авахын тулд авахыг хүссэн хуудасны дээд хэсэгт байрлах гурван цэгтэй цэсийн дүрс дээр товшоод Дэлгэцийн агшин авах эсвэл- г сонгоно уу. Бүрэн хэмжээний дэлгэцийн агшин авах.

  3. Дэлгэцийн агшинг харахын тулд "дэлгэцийн агшин" гэж бичнэ үү. Эдгээр нь:

    • Тус газрын дэлгэцийн агшинг авах
    • Бүрэн хэмжээний дэлгэцийн агшин авах
    • Зангилааны дэлгэцийн агшинг авах
    • Дэлгэцийн агшин авах
    Image
    Image
  4. Доошоо гүйлгээд хулганаа эсвэл гар дээрхи сум товчийг ашиглан дарахыг хүсэж буй дэлгэцийн агшингаа сонгоно уу.

Chrome хөгжүүлэгчийн дэлгэцийн зургийн сонголт

Дэлгэцийн нэг хэсгийг авахын тулд Дэлгэцийн зураг авах-г сонгоно уу. Хулганаа ашиглан дэлгэцийн зураг авахыг хүссэн хэсгийнхээ эргэн тойронд хайрцгийг чирнэ үү.

Вэб хуудасны дэлгэцийн агшинг бүхэлд нь авахын тулд Бүрэн хэмжээний дэлгэцийн агшин авах-г сонгоно уу. Энэ сонголт нь танд нэг дэлгэц дээр тохирохгүй вэб хуудасны зургийг авах боломжийг олгоно.

Энэ сонголт нь вэб сайтаас шалтгаалаад бидний туршилтанд холимог үр дүнд хүрсэн.

Хэрэв та стандарт дэлгэцийн агшин авахыг хүсвэл Дэлгэцийн агшин авах-г сонгоно уу. Энэ нь таны дэлгэцэн дээр харагдаж байгаа зүйлийг шүүнэ.

Эцэст нь та Зангилааны дэлгэцийн зургийг авах-г сонгосноор HTML элементийн дэлгэцийн агшинг авах боломжтой.

Та дэлгэцийн агшинг авсны дараа Хадгалах харилцах цонх гарч ирнэ. Фолдер сонгоод дэлгэцийн агшиндаа файлын нэр өгнө үү. Хөгжүүлэгчийн хэрэглүүр ашиглан авсан бүх дэлгэцийн агшинг Chrome-ын татаж авах менежерээс авах боломжтой.

Зөвлөмж болгож буй: