Cách kiểm tra kích thước và khuôn mặt phông chữ trên trang web

Cho dù bạn đang thiết kế hay chỉ thích giao diện của một trang web cụ thể, việc biết loại phông chữ mà trang web đang sử dụng và kích thước của nó có thể giúp bạn mô phỏng nó hoặc sử dụng nó trên trang web của riêng bạn. Có một số cách để đạt được điều này và tôi sẽ chỉ cho bạn một vài cách trong số đó ở đây. Vì vậy, nếu bạn muốn kiểm tra loại và kích thước phông chữ trên một trang web, hãy đọc tiếp!

Cách kiểm tra kích thước và khuôn mặt phông chữ trên trang web

Với hàng triệu phông chữ ngoài kia, việc tìm kiếm một phông chữ hoàn hảo có thể mất nhiều thời gian hơn mức cần thiết. Khi bạn phát hiện ra một mặt hàng tốt, bạn cần phải tìm hiểu xem nó đang ở đâu và sau đó, nếu không bạn có thể đánh mất nó. Nếu nó là một phông chữ đặc biệt tốt, bạn có thể sử dụng nó trên trang web của riêng mình, làm phông chữ Office hoặc trong Windows tùy thuộc vào loại phông chữ đó. Chỉ cần đảm bảo rằng một số phông chữ đã được đăng ký bản quyền và không có sẵn để sử dụng công khai.

Kiểm tra loại và kích thước phông chữ trên trang web

Có một số cách để kiểm tra loại và kích thước phông chữ trên bất kỳ trang web nào. Phương pháp dễ nhất sử dụng chính trình duyệt, trong khi các phương pháp khác sử dụng các công cụ của bên thứ ba để xác định nội dung trang. Tôi sẽ bao gồm cả hai loại. Đầu tiên, chúng tôi sẽ tập trung vào phương pháp trình duyệt tích hợp sẵn.

  1. Nhấp chuột phải vào trang bạn thích giao diện và chọn Kiểm tra phần tử (Firefox), Kiểm tra (Chrome) hoặc Công cụ nhà phát triển F12 (Edge).
  2. Chọn Thanh tra (Firefox) trong cửa sổ dưới cùng mới và cuộn xuống bên phải cho đến khi bạn đến Phông chữ. Nó phải hiển thị họ phông chữ, phông chữ cụ thể được sử dụng, kích thước, màu sắc của nó và bất kỳ thứ gì khác mà trang xác định.

Các CMS khác nhau và các thiết kế web khác nhau hiển thị thông tin phông chữ của chúng theo nhiều cách khác nhau. Hãy thử phương pháp này trên một vài trang web và bạn có thể sẽ thấy một vài cách khác nhau để xác định phông chữ.

how-to-check-font-type-and-size-on-a-website-2

Các công cụ của bên thứ ba để xác định loại và kích thước phông chữ

Có một số tiện ích bổ sung của bên thứ ba hoạt động dưới dạng plugin hoặc như bookmarklet và có thể xác định loại phông chữ. Chúng hoạt động với hầu hết các trình duyệt, bao gồm cả Safari, vì vậy bạn nên tìm thứ gì đó mà bạn có thể làm việc mà không gặp nhiều khó khăn.

Firebug

Firebug từng là công cụ gỡ lỗi chỉ dành cho các nhà phát triển trên Firefox. Nó trở nên phổ biến đến nỗi bây giờ là trình duyệt bất khả tri và sẽ hoạt động với hầu hết các trình duyệt. Nó là một công cụ cực kỳ linh hoạt có thể kiểm tra bất kỳ thành phần nào của trang web, bao gồm cả phông chữ.

Chỉ cần cài đặt tiện ích bổ sung như bình thường, đánh dấu một số văn bản trên trang, nhấp vào tab HTML trong Firebug, sau đó nhấp vào ‘Tính toán’ ở bên phải. Firebug sau đó sẽ đánh dấu tên phông chữ, họ phông chữ, kích thước, trọng lượng và mọi thứ bạn cần biết.

Tuy nhiên, hãy nhớ rằng Firebug đã ngừng hoạt động kể từ năm 2017. Bạn vẫn có thể tải xuống các phiên bản cũ hơn của nó, nhưng chúng sẽ không được cập nhật nữa và Firebug có thể sẽ mất chức năng khi trình duyệt phát triển.

how-to-check-font-type-and-size-on-a-website-3

WhatFont

WhatFont là một bookmarklet có thể xác định phông chữ trên các trang web. Kéo bookmarklet vào thanh dấu trang của bạn và sử dụng nó để xác định hầu hết mọi phông chữ, ở bất kỳ đâu. Nó miễn phí để sử dụng và rất đơn giản. Điều hướng đến trang web bạn thích, nhấp vào bookmarklet và di chuột qua phông chữ bạn muốn xác định. Một hộp đen nhỏ xuất hiện trên nó, cho bạn biết phông chữ.

Khi được cập nhật, nó thậm chí còn được làm cho tương thích với các tiện ích bổ sung liên quan.

Một lần nữa, tùy thuộc vào cách CMS được định cấu hình hoặc cách trang được thiết kế, đây sẽ là một nhận dạng phông chữ đơn giản hoặc một hộp đầy đủ cung cấp cho bạn kích thước, màu sắc, trọng lượng, v.v.

Có rất nhiều tiện ích bổ sung kiểu bookmarklet có thể xác định phông chữ; WhatFont chỉ là một trong số đó. Bạn có sử dụng một? Bài viết này đã thuyết phục bạn thử một cái mới chưa? Hãy cho chúng tôi biết bên dưới.

About admin

Check Also

Nổi bật với những ý tưởng bìa nổi bật Instagram độc đáo này

Đó là năm 2022, vì vậy có lẽ không phải là tin tức đối với …

Leave a Reply

  • https://truthandidentity.com/sitemap.txt
  • https://ullica.ru/sitemap.txt
  • https://apukakvilaga.hu/sitemap.txt
  • https://hagiudvar.hu/sitemap.txt
  • https://koronamako.hu/sitemap.txt
  • https://petrezselyemfarm.hu/sitemap.txt
  • https://profop.top/sitemap.txt
  • https://budart.top/sitemap.txt
  • https://jobding.club/sitemap.txt
  • https://kpk-coin.top/sitemap.txt
  • https://plekhov.top/sitemap.txt
  • https://zhitlobud.top/sitemap.txt
  • https://budpro.top/sitemap.txt
  • https://mytheme.top/sitemap.txt
  • http://memorya.org/sitemap/sitemap_gkfqo.txt
  • http://memorya.org/sitemap/sitemap_upeqq.txt
  • http://memorya.org/sitemap/sitemap_uneqp.txt
  • http://memorya.org/sitemap/sitemap_pmeqi.txt
  • http://memorya.org/sitemap/sitemap_unfqi.txt
  • http://memorya.org/sitemap/sitemap_omeqi.txt
  • http://memorya.org/sitemap/sitemap_nmpqi.txt
  • http://memorya.org/sitemap/sitemap_qmeqi.txt
  • http://memorya.org/sitemap/sitemap_imfqi.txt
  • http://memorya.org/sitemap/sitemap_upkqi.txt
  • https://99bigstore.com/sitemap/sitemap_gkfqo.txt
  • https://99bigstore.com/sitemap/sitemap_upeqq.txt
  • https://99bigstore.com/sitemap/sitemap_uneqp.txt
  • https://99bigstore.com/sitemap/sitemap_pmeqi.txt
  • https://99bigstore.com/sitemap/sitemap_unfqi.txt
  • https://99bigstore.com/sitemap/sitemap_omeqi.txt
  • https://99bigstore.com/sitemap/sitemap_nmpqi.txt
  • https://99bigstore.com/sitemap/sitemap_qmeqi.txt
  • https://99bigstore.com/sitemap/sitemap_imfqi.txt
  • https://99bigstore.com/sitemap/sitemap_upkqi.txt
  • https://safariplanet.co
  • https://safariplanet.org
  • http://safenaat.com
  • https://sahanaahmed.com
  • https://sahelnalk.com
  • https://saint-romain-les-atheux.fr
  • http://saints.org
  • http://saisystemintegration.in
  • http://sakaivn.com
  • https://salam-day.com
  • http://sales.hyleetraining.com
  • https://salik-group.com
  • https://salonbeauregard.ch
  • http://salondemo.mycrm.ge
  • http://saltlake.kpcph.com
  • https://salviasuites.gr
  • https://salwa-ibrahim-stress-free-living.com
  • https://samacharcafe.com
  • https://samallenportfolio.co.uk
  • http://samwilsonfilm.com
  • https://sanaanow.com
  • https://sandawanaspa.co.za
  • https://san-diegopost.com
  • https://san-diegotechpost.com
  • http://sandramoncada.com.co
  • https://sandrotourmendoza.com
  • https://sandyfootprints.co.uk
  • http://sangamprints.com
  • https://sangbadsaptah.com
  • https://sanitiseireland.ie
  • https://sankhlakulfi.com
  • https://santanasoft2.site
  • https://sapcs.eu
  • https://sapokone.mydome.jp
  • http://saqibbashir.com
  • https://sarahbeemarketing.com
  • http://sarakramer.info
  • http://sarkarijobhit.com
  • https://sarling.com
  • https://saskatoonrvrentals.ca
  • https://satanpharma.com
  • https://sathyashenoy.com
  • https://saudavelefeliz.com
  • https://sauvedesigns.com
  • https://savenishabd.com
  • https://savetheearth.nu
  • https://savici.in
  • http://savvyinsured.com
  • http://sayedadnan.com
  • https://scg-re.ga
  • https://schat3.nl
  • https://schlossvollrads.com
  • https://schmelzgut.com
  • http://schonfeld.org.uk
  • https://schoolparking.org.uk
  • https://schooner.org
  • http://scootconsult.com
  • https://scope.ro
  • https://scottpagedesign.com
  • https://sdcdrywall.thenewdigitalagency.com
  • http://sdfood.co.jp
  • https://sdg-csr.kz
  • https://sdiocnz.org
  • https://searchengineopt.com
  • https://searchfromname.com
  • https://seasonshd.com
  • https://seasonsofmomhood.com
  • https://seaspimex.com.vn
  • https://seblsupplies.com
  • https://secondhandsweepers.com.au
  • https://secretnuclearbunker.com
  • https://sectorx.org.kz
  • https://seewind-ferienwohnungen.de
  • https://segundaopinion.com.co
  • https://seifacademy.nl
  • https://selectrealestate.co.uk
  • https://semsea-wellness.be
  • https://seniklogisticsllc.com
  • https://seniorcitizenfun.com
  • https://seniorcoastalliving.com
  • https://seotools.name
  • https://serbiawealth.info
  • http://serdar-naehmaschinen.de
  • https://serenoa.co.uk
  • http://seresna.es
  • https://sergiofajardo.co
  • https://serti.es
  • https://server0415.guardianhost.com
  • http://setagaya-boxinggym.com
  • https://setantafitness.com
  • https://sfew768.org
  • https://shahed.news
  • https://shahidhasan.com
  • http://shahzadpumps.com
  • http://shakerhospital.com
  • https://shannajean.com
  • https://shannonjamesmedium.com
  • http://shantijoseph.com
  • https://share-community.jp
  • https://sharemienphi.net