Return to Video

CSS font size

  • 0:01 - 0:04
    CSS-ს გამოყენება ტექსტის ზომის შესაცვლელადაც
    შეგვიძლია.
  • 0:04 - 0:07
    უკვე შეგიძლიათ ნახოთ და შეადაროთ
    სათაურისა
  • 0:07 - 0:09
    და აბზაცების ზომა, როგორც ბრაუზერმა
    უკვე გააკეთა
  • 0:09 - 0:12
    დეფოლტ სტილით, განსხვავებული ზომა გამოიყენა
    განსხვავებული ელემენტებისთვის.
  • 0:12 - 0:14
    აქ არის შინაარსის შრიფტის ზომა
  • 0:14 - 0:16
    და უფრო დიდი ზომა თითოეული
    დონის სათაურზე.
  • 0:16 - 0:19
    ზოგჯერ, ჩვენ ამ ზომების შეცვლაც
    გვსურს.
  • 0:19 - 0:22
    და ჩვენ ამის გაკეთებაა CSS-ის `font-size`(შრიფტის ზომა)
    ფუნქციითაც შეგვიძლია.
  • 0:22 - 0:24
    მაგალითად:
  • 0:24 - 0:29
    როგორ გავაკეთოთ მთელი ტექსტი ჩვენს გვერდზე
    ცოტა მომცრო ზომის?
  • 0:29 - 0:31
    კარგი, ჩვენ გადავალთ `style` თეგზე,
  • 0:31 - 0:35
    და დავამატებთ CSS წესს`body`თეგზე.
  • 0:35 - 0:39
    და შემდეგ, მასში ჩავსვამთ `font-size` ფუნქციას.
  • 0:39 - 0:43
    ახლა, რა მნიშვნელობა უნდა მივანიჭოთ
    `font-size`-ს?
  • 0:43 - 0:46
    რას ვიყენებთ მის გასაზომად?
  • 0:46 - 0:48
    ეს ნამდვილად კარგი შეკითხვაა.
  • 0:48 - 0:50
    რადგან აქ სულ მცირე ათი
    განსხვავებული ერთეოულია,
  • 0:50 - 0:53
    CSS-ში `font-size`-სთვის.
  • 0:53 - 0:56
    მოდი დავიწყოთ იმ ერთეულით, რომელიც
    ადრეც გინახავთ: პიქსელით.
  • 0:56 - 0:59
    ჩვენ პიქსელებს სურათების ზომების გადასაწყვეტად
    ვიყენებდით.
  • 0:59 - 1:01
    და მათ გამოყენებას CSS-შიც განვაგრძობთ.
  • 1:01 - 1:03
    მოდი ვცადოთ 11 პიქსელი.
  • 1:04 - 1:06
    ჰაჰ, ყველაფერი დაპატარავდა.
  • 1:06 - 1:09
    სათაურებიც კი.
  • 1:09 - 1:11
    რატომ დაპატარავდნენ ისინიც?
  • 1:11 - 1:16
    ისინი ისევ იგივე პიქსელების ზომის არ უნდა
    არჩენილიყვნენ,რაც ბრაუზერმა დაადგინა მათთვის?
  • 1:16 - 1:16
    არა!
  • 1:16 - 1:22
    რადგან ბრაუზერის დეფოლტ სტილი
    არ არის განსაზღვრული პიქსელებში.
  • 1:22 - 1:25
    ისინი განსხვავებული ერთეულითაა განსაზღვრული,
    რომლებსაც ჩვენ "em"-ს ვუწოდებთ.
  • 1:25 - 1:27
    და ეს ფარდობითი ერთეულია,
  • 1:27 - 1:32
    რომელიც სათაურის შრიფტის ზომის მასშტაბს
    ტექსტის შრიფტის პროპორციულს ხდის.
  • 1:32 - 1:34
    მოდი გაჩვენებთ, რას ვგულისხმობ.
  • 1:34 - 1:36
    გადავიდეთ `h2` სტილის წესზე
  • 1:37 - 1:39
    და დავამატოთ `font-size` ფუნქცია.
  • 1:39 - 1:44
    ამ დროს, პიქსელებში ფიქრის ნაცვლად,
    მე ფარდობითად ვფიქრობ.
  • 1:45 - 1:50
    ტექსტთან შედარებით
    რამდენჯერ დიდი გვინდა იყოს ``?
  • 1:50 - 1:53
    იქნებ, ორჯერ დიდი?
  • 1:53 - 1:57
    ამისთვის, ჩვენ `2em` უნდა ჩავწეროთ.
  • 1:57 - 2:00
    ახლა ბრაუზერმა უბრალოდ გამოთვალა
  • 2:00 - 2:02
    შრიფტის ზომა პიქსელებში.
  • 2:02 - 2:05
    ბრაუზერმა იცის, რომ შინაარსის ზომა
    არის 11 პიქსელი.
  • 2:05 - 2:08
    და თქვენ მიუთითეთ რომ `h2` უნდა იყოს
    ორჯერ უფრო დიდი,
  • 2:08 - 2:12
    ასე რომ, ახლა ყველა``
    22 პიქსელის სიდიდისაა,
  • 2:12 - 2:17
    თუ ჩვენ შინაარსის ტექსტს 12 პიქსელდამდ
    გავზრდით,
  • 2:17 - 2:19
    მაშინ რა სიდიდის იქნება ``?
  • 2:19 - 2:22
    ეს მართალია, 24 პიქსელის.
  • 2:22 - 2:26
    რა მოხდება თუ`h2` შრიფტის ზომას
    1.5em -მდე შევცვლით?
  • 2:27 - 2:31
    ახლა `h2` იქნება 12 ჯერ 1.5
  • 2:31 - 2:33
    ანუ 18 პიქსელი ზომის.
  • 2:33 - 2:38
    ჩვენ პიქსელების ზომის მითითება `h2`სთვისაც
    შეგვიძლია, ისე როგორც `body`სთვის ვაკეთებდით,
  • 2:38 - 2:40
    და იგივენაირად იმუშავებს.
  • 2:40 - 2:42
    არჩევანი იმაზეა დამოკიდებული,
    რომელი უფრო გეადვილებათ.
  • 2:42 - 2:45
    და როგორც უკვე ვთქვი, აქ ბევრი ერთეულის
    გამოყენება შეგვიძლია
  • 2:45 - 2:47
    pixel-ებისა და em-ის გარდა.
  • 2:47 - 2:50
    ეს უბრალოდ ორი ყველაზე პოპულარული
    ერთეულია.
  • 2:50 - 2:51
    მაგრამ, თუ თქვენ სხვების არჩევა გსურთ,
  • 2:51 - 2:53
    შეამოწმეთ `font-size`-ს მონაცემები
  • 2:53 - 2:55
    ან მოძებნეთ ინტერნეტში ტუტორიალები.
  • 2:55 - 2:59
    შრიფტის ზომის გამოყენების დროა!
Title:
CSS font size
Description:

more » « less
Video Language:
English
Duration:
03:00
Mari Telia edited Georgian subtitles for CSS font size

Georgian subtitles

Incomplete

Revisions