Хэрхэн Html дээр фонтоо тохируулах вэ

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

Хэрхэн Html дээр фонтоо тохируулах вэ
Хэрхэн Html дээр фонтоо тохируулах вэ

Видео: Хэрхэн Html дээр фонтоо тохируулах вэ

Видео: Хэрхэн Html дээр фонтоо тохируулах вэ
Видео: Хуудасны хэмжээг тохируулах. Хуудасны хэмжээг A4 болгох 2024, May
Anonim

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

Html дээр фонтоо хэрхэн тохируулах талаар
Html дээр фонтоо хэрхэн тохируулах талаар

Шаардлагатай

TTF форматтай фонт файл

Зааварчилгаа

1-р алхам

Компьютер дээрээ суулгасан фонтуудын багцыг ашиглахын тулд каскад хэлбэрийн хуудасны font-family параметрийг ашиглаж болно. Үүнийг хийхийн тулд хүссэн зүйлдээ дараах кодыг оруулна уу.

Текст

Энэ тушаал нь Arial шрифтийн хоёр дахь түвшний h2 гарчгийг харуулах болно.

Алхам 2

Хэрэв та өөрийн фонтыг ашиглахыг хүсвэл эхлээд үүнийг хостинг руу байршуулж, тохирох командыг ашиглан идэвхжүүлэх хэрэгтэй. TTF файлуудыг дараах тушаалын хамт оруулсан болно.

Энэ тохиолдолд фонт-гэр бүлийн шинж чанар нь үсгийн нэрийг, src: url (font.ttf) нь TTF файл руу орох замыг зааж өгдөг.

Алхам 3

Элементийг идэвхжүүлсний дараа та үүнийг текстийг харуулахын тулд ашиглаж болно:

Текст

Энэ тушаал нь хоёр дахь түвшний гарчигт шаардлагатай үсгийн фонтыг налуугаар харуулах үүрэгтэй. Хэрэв хэрэглэгчийн хөтөч TTF файлтай ажиллахыг дэмждэггүй бол эхний таслалаас хойш заасан системийн фонтыг (энэ тохиолдолд Verdana) ашиглах болно.

Алхам 4

Зарим хөтөч татаж авах TTF програмыг дэмждэггүй. Жишээлбэл, Internet Explorer 8 нь текстийг харуулахдаа EOT форматыг ашигладаг. Ийм хөтөчүүдийн хувьд анхны TTF-ийг олон үйлчилгээг ашиглан хөрвүүлж, @ font-face параметрт гарсан үсгийн хэв маягийг ижил аргаар оруулна уу.

Алхам 5

Хэрэв та өөр файлаас хэрэгтэй файлаа импортлохыг хүсвэл CSS баримт бичгийн дээд хэсэгт бичсэн @import тушаалыг ашиглана уу.

@ импортын url (https:// font_address)

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