Return to Video

CSS იდენტიფიკატორის მითითება

  • 0:00 - 0:02
    ამ ვებგვერდზე ჩვენ ვიყენებთ CSS-ს,
  • 0:02 - 0:05
    რომ შევცვალოთ -ი და აბზაცები ისე, რომ
  • 0:05 - 0:10
    ყოველი იყოს მწვანე
    და ყოველი აბზაცი იისფერი.
  • 0:10 - 0:13
    მაგრამ, ვთქვათ გვინდა მივუთითოთ
    ფერი მხოლოდ პირველი -სთვის
  • 0:13 - 0:17
    ან მხოლოდ მეორე აბზაცისთვის?
  • 0:17 - 0:21
    ჩვენ უნდა მოვიფიქროთ თუ როგორ მივუთითოთ
    ბრაუზერს ზუსტად ის ელემენტები,
  • 0:21 - 0:25
    რომელთა თვისებების შეცვლაც გვინდა.
  • 0:25 - 0:28
    ამის ერთ-ერთი ხერხი არის ID-ს მითითება.
  • 0:28 - 0:32
    ჩვენ შეგვიძლია დავთაგოთ ჩვენს გვერდზე
    უნიკალური ID, შემდეგ კი მივუთითოთ CSS-ს
  • 0:32 - 0:38
    რომ გვინდა მხოლოდ ამ ელემენტის
    შეცვლა და არა ყველა მათგანის.
  • 0:38 - 0:41
    ამის გასაკეთებლად პირველი ნაბიჯია
    HTML-ის შეცვლა ისე, რომ
  • 0:41 - 0:46
    დავამატოთ ID ატრიბუტები იმ თეგებს,
    რომელთა შეცვლაც გვინდა.
  • 0:46 - 0:48
    მოდი, დავიწყოთ მეორე აბზაცით.
  • 0:48 - 0:53
    ID-ს თვისების დასამატებლად, მიგვაქვს
    კურსორი თეგის დასაწყისში
  • 0:53 - 0:57
    p-ს გვერდზე, შემდეგ ვტოვებთ
    ადგილს და ვწერთ:
  • 0:57 - 0:59
    id = "
  • 0:59 - 1:03
    ახლა ჩვენ უნდა შევავსოთ ID თვისება
    მნიშნველობით.
  • 1:03 - 1:04
    რომელი ID უნდა მივცე?
  • 1:04 - 1:07
    ID უნდა იყოს აზრიანი და უნიკალური.
  • 1:07 - 1:09
    ამ გვერდზე არაფერს არ უნდა ჰქონდეს
    იგივე ID.
  • 1:09 - 1:15
    რადგან ეს რეალურად სიმღერაა კურდღლების
    შესახებ, დავარქვათ rabbits-song.
  • 1:15 - 1:20
    ჩვენ შეგვიძლია ადგილები გამოვტოვოთ
    ID-ში და რამდენიმე სიტყვა ჩავწეროთ.
  • 1:20 - 1:23
    ასევე შეგვიძლია დეფისების ან
    ქვედა ტირეს გამოყენება.
  • 1:23 - 1:26
    მე პირადად მომწონს დეფისები.
  • 1:26 - 1:29
    ახლა შეგვიძლია მოვახდინოთ ამ აბზაცის
    უნიკალური იდენტიფიცირება.
  • 1:29 - 1:32
    შესაბამისად შეგვიძლია CSS-ს
    ზუსტად მივუთითოთ იგი.
  • 1:32 - 1:36
    ახლა დავუბრუნდეთ ჩვენს თეგს
    მეორე ნაბიჯისთვის.
  • 1:36 - 1:39
    დავამატოთ ახალი ხაზი,
    ბოლო წესის შემდეგ.
  • 1:39 - 1:43
    დაიმახსოვრეთ, პირველი ნაწილი
    CSS-ის წესის არის მიმთითებელი:
  • 1:43 - 1:46
    ნაწილი, რომელიც ეუბნება ბრაუზერს
    თუ რას ვუთითებთ.
  • 1:46 - 1:51
    ჩვენს წინა წესებში, ჩვენ გამოვიყენეთ
    მიმთითებლები და ,
  • 1:51 - 1:55
    რომ მიგვეთითებინა ყველ და
    გვერდზე.
  • 1:55 - 1:59
    ახლა შევქმნათ მიმთითებელი, რომელიც მხოლოდ
    კონკრეტული ID-ს ელემენტებს მიმართავს.
  • 1:59 - 2:05
    მიმთითებელი იწყება დიეზით, ეს ეუბნება
    ბრაუზერს, რომ მის შემდეგ ID დაიწერება.
  • 2:05 - 2:10
    ახლა დავწეროთ ჩვენი ID.
    rabbits-song.
  • 2:10 - 2:12
    წესის დარჩენილი ნაწილი იგივეა, რასაც
    ვიყენებდით.
  • 2:12 - 2:14
    ვხსნით და ვხურავთ ფიგურულ ფრჩხილს.
  • 2:14 - 2:18
    ვაბატებთ, თვისებას, მაგალითად ფონის ფერს.
  • 2:18 - 2:21
    და ისიც მუშაობს!
  • 2:21 - 2:24
    მხოლოდ სიმღერის აბზაცს აქვს ყვითელი ფონი.
  • 2:24 - 2:27
    პირველი აბზაცის ფონი კი იგივე დარჩა.
  • 2:27 - 2:31
    მოდი, ისევ გავაკეთოთ, პირველი -სთვის
    მაგალითად.
  • 2:31 - 2:34
    გახსოვთ პირველი ნაბიჯი?
  • 2:34 - 2:38
    სწორია, ჯერ უნდა შევცვალოთ HTML,
    რომ მივუთითოთ 'id' თვისება.
  • 2:38 - 2:42
    მიგვაქვს კურსორი თეგის დასაწყისში,
    ვტოვებთ ადგილს და ვწერთ
  • 2:42 - 2:44
    id =
  • 2:44 - 2:47
    შემდეგ ვწერთ უნიკალურ და აზრიან ID-ს.
  • 2:47 - 2:51
    მაგალითად, "rabbits-info-heading".
  • 2:51 - 2:54
    ახლა მეორე ნაბიჯი.
    დავბრუნდეთ ჩვენს სტილის თეგში
  • 2:54 - 3:02
    დავამატოთ ახალი ხაზი,
    დავწეროთ დიეზი, შემდეგ ჩვენი ID
  • 3:02 - 3:05
    rabbits-info-Heading და ჩავსვათ ჩვენი
    თვისება ფიგურულ ფრჩხილებში
  • 3:05 - 3:09
    {background-color: purple;
    }
  • 3:09 - 3:13
    მაგრამ, ამჯერად არ იმუშავა.
    რა შემეშალა?
  • 3:13 - 3:15
    იმავე ნაირად დავწერე?
  • 3:15 - 3:18
    rabbits-info-Heading
    rabbits-info-heading
  • 3:18 - 3:25
    ძალიან გვანან ერთმანეთს, მაგრამ, მოდით,
    ასო-ასო შევადაროთ, რომ გავიგოთ რა ხდება.
  • 3:25 - 3:30
    მაგრამ ახლა უბრალოდ ქვევით ჩავალ
    და ID-ს მივუთითებ HTML-ში
  • 3:30 - 3:34
    და შემდეგ აქ დავაკოპირებ, იმისათვის
    რომ აბსოლუტურად იდენტური იყოს.
  • 3:34 - 3:36
    ახლა კი მუშაობს!
  • 3:36 - 3:40
    ჩემს -ს აქვს ფონი.
    მიხვდით რა შეიცვალა?
  • 3:40 - 3:44
    შეიძლება მიხვდით, ჩვენ გვეწერა H,
    უნდა დაგვეწერა h,
  • 3:44 - 3:47
    ბრაუზერი მათ ერთნაირად ვერ აღიქვამს.
  • 3:47 - 3:50
    უნდა ყოფილიყო h, რომ დამთხვეოდა HTML-ს.
  • 3:50 - 3:53
    ID-ში მნიშვნელობა აქვს დიდ
    და პატარა ასოებს.
  • 3:53 - 3:58
    ყოველ ჯერზე იდენტურად უნდა გეწეროთ.
  • 3:58 - 4:02
    მაგალითად, მე ყოველთვის პატარა
    ასოებით ვწერ ID-ს, შემდეგ
  • 4:02 - 4:05
    რომ არ დავიწყო ფიქრი დიდი ასო
    გამოვიყენე თუ პატარა.
  • 4:05 - 4:08
    ახლა საბოლოო გაფრთხილებას მოგცემთ.
  • 4:08 - 4:11
    ID უნდა იყოს უნიკალური!
  • 4:11 - 4:13
    თუ გექნებათ ორი თეგი ვებგვერდზე
    იდენტური ID-თი,
  • 4:13 - 4:18
    ბრაუზერმა შეიძლება ორივე შეცვალოს,
    ან არც ერთი.
  • 4:18 - 4:21
    თქვენ მგონი არ გინდათ ეს რომ მოხდეს.
  • 4:21 - 4:24
    უნიკალური და აზრიანი ID.
Title:
CSS იდენტიფიკატორის მითითება
Video Language:
English
Duration:
04:25
ბესარიონ სათნო edited Georgian subtitles for CSS Selecting by id

Georgian subtitles

Revisions

  • Revision 1 Edited
    ბესარიონ სათნო
Our website uses cookies for analysis purposes.