WEBVTT

00:00:00.095 --> 00:00:02.336
ამ ვებგვერდზე ჩვენ ვიყენებთ CSS-ს,

00:00:02.336 --> 00:00:04.600
რომ შევცვალოთ -ი და აბზაცები ისე, რომ

00:00:04.600 --> 00:00:09.540
ყოველი  იყოს მწვანე
და ყოველი აბზაცი იისფერი.

00:00:09.540 --> 00:00:13.460
მაგრამ, ვთქვათ გვინდა მივუთითოთ
ფერი მხოლოდ პირველი -სთვის

00:00:13.460 --> 00:00:16.882
ან მხოლოდ მეორე აბზაცისთვის?

00:00:16.882 --> 00:00:20.557
ჩვენ უნდა მოვიფიქროთ თუ როგორ მივუთითოთ
ბრაუზერს ზუსტად ის ელემენტები,

00:00:20.557 --> 00:00:25.343
რომელთა თვისებების შეცვლაც გვინდა.

00:00:25.343 --> 00:00:28.315
ამის ერთ-ერთი ხერხი არის ID-ს მითითება.

00:00:28.315 --> 00:00:32.165
ჩვენ შეგვიძლია დავთაგოთ ჩვენს გვერდზე
უნიკალური ID, შემდეგ კი მივუთითოთ CSS-ს

00:00:32.176 --> 00:00:38.447
რომ გვინდა მხოლოდ ამ ელემენტის
შეცვლა და არა ყველა მათგანის.

00:00:38.455 --> 00:00:41.281
ამის გასაკეთებლად პირველი ნაბიჯია
HTML-ის შეცვლა ისე, რომ

00:00:41.281 --> 00:00:45.631
დავამატოთ ID ატრიბუტები იმ თეგებს,
რომელთა შეცვლაც გვინდა.

00:00:45.631 --> 00:00:47.841
მოდი, დავიწყოთ მეორე აბზაცით.

00:00:47.841 --> 00:00:53.316
ID-ს თვისების დასამატებლად, მიგვაქვს
კურსორი  თეგის დასაწყისში

00:00:53.316 --> 00:00:57.225
p-ს გვერდზე, შემდეგ ვტოვებთ
ადგილს და ვწერთ:

00:00:57.225 --> 00:00:59.017
id = "

00:00:59.017 --> 00:01:02.847
ახლა ჩვენ უნდა შევავსოთ ID თვისება
მნიშნველობით.

00:01:02.847 --> 00:01:04.180
რომელი ID უნდა მივცე?

00:01:04.180 --> 00:01:06.542
ID უნდა იყოს აზრიანი და უნიკალური.

00:01:06.542 --> 00:01:09.479
ამ გვერდზე არაფერს არ უნდა ჰქონდეს
იგივე ID.

00:01:09.479 --> 00:01:15.430
რადგან ეს რეალურად სიმღერაა კურდღლების
შესახებ, დავარქვათ rabbits-song.

00:01:15.430 --> 00:01:19.837
ჩვენ შეგვიძლია ადგილები გამოვტოვოთ
ID-ში და რამდენიმე სიტყვა ჩავწეროთ.

00:01:19.837 --> 00:01:22.667
ასევე შეგვიძლია დეფისების ან
ქვედა ტირეს გამოყენება.

00:01:22.667 --> 00:01:25.657
მე პირადად მომწონს დეფისები.

00:01:25.657 --> 00:01:29.081
ახლა შეგვიძლია მოვახდინოთ ამ აბზაცის
უნიკალური იდენტიფიცირება.

00:01:29.081 --> 00:01:31.766
შესაბამისად შეგვიძლია CSS-ს
ზუსტად მივუთითოთ იგი.

00:01:31.766 --> 00:01:35.619
ახლა დავუბრუნდეთ ჩვენს  თეგს
მეორე ნაბიჯისთვის.

00:01:35.619 --> 00:01:39.448
დავამატოთ ახალი ხაზი,
ბოლო წესის შემდეგ.

00:01:39.478 --> 00:01:43.255
დაიმახსოვრეთ, პირველი ნაწილი
CSS-ის წესის არის მიმთითებელი:

00:01:43.255 --> 00:01:46.160
ნაწილი, რომელიც ეუბნება ბრაუზერს
თუ რას ვუთითებთ.

00:01:46.160 --> 00:01:51.130
ჩვენს წინა წესებში, ჩვენ გამოვიყენეთ
მიმთითებლები  და ,

00:01:51.130 --> 00:01:54.561
რომ მიგვეთითებინა ყველ  და 
გვერდზე.

00:01:54.561 --> 00:01:58.693
ახლა შევქმნათ მიმთითებელი, რომელიც მხოლოდ
კონკრეტული ID-ს ელემენტებს მიმართავს.

00:01:58.693 --> 00:02:05.172
მიმთითებელი იწყება დიეზით, ეს ეუბნება
ბრაუზერს, რომ მის შემდეგ ID დაიწერება.

00:02:05.172 --> 00:02:09.628
ახლა დავწეროთ ჩვენი ID.
rabbits-song.

00:02:09.628 --> 00:02:11.942
წესის დარჩენილი ნაწილი იგივეა, რასაც
ვიყენებდით.

00:02:11.942 --> 00:02:13.722
ვხსნით და ვხურავთ ფიგურულ ფრჩხილს.

00:02:13.722 --> 00:02:18.384
ვაბატებთ, თვისებას, მაგალითად ფონის ფერს.

00:02:18.384 --> 00:02:20.944
და ისიც მუშაობს!

00:02:20.944 --> 00:02:23.934
მხოლოდ სიმღერის აბზაცს აქვს ყვითელი ფონი.

00:02:23.934 --> 00:02:26.583
პირველი აბზაცის ფონი კი იგივე დარჩა.

00:02:26.583 --> 00:02:31.144
მოდი, ისევ გავაკეთოთ, პირველი -სთვის
მაგალითად.

00:02:31.144 --> 00:02:33.506
გახსოვთ პირველი ნაბიჯი?

00:02:33.515 --> 00:02:38.326
სწორია, ჯერ უნდა შევცვალოთ HTML,
რომ მივუთითოთ 'id' თვისება.

00:02:38.326 --> 00:02:41.743
მიგვაქვს კურსორი თეგის დასაწყისში, 
ვტოვებთ ადგილს და ვწერთ

00:02:41.743 --> 00:02:43.520
id =

00:02:43.580 --> 00:02:46.841
შემდეგ ვწერთ უნიკალურ და აზრიან ID-ს.

00:02:46.841 --> 00:02:50.704
მაგალითად, "rabbits-info-heading".

00:02:50.704 --> 00:02:54.043
ახლა მეორე ნაბიჯი.
დავბრუნდეთ ჩვენს სტილის თეგში

00:02:54.043 --> 00:03:01.869
დავამატოთ ახალი ხაზი,
დავწეროთ დიეზი, შემდეგ ჩვენი ID

00:03:01.869 --> 00:03:04.947
rabbits-info-Heading და ჩავსვათ ჩვენი
თვისება ფიგურულ ფრჩხილებში

00:03:04.947 --> 00:03:08.935
{background-color: purple; 
}

00:03:08.945 --> 00:03:13.420
მაგრამ, ამჯერად არ იმუშავა.
რა შემეშალა?

00:03:13.420 --> 00:03:15.389
იმავე ნაირად დავწერე?

00:03:15.389 --> 00:03:18.495
rabbits-info-Heading
rabbits-info-heading

00:03:18.495 --> 00:03:25.129
ძალიან გვანან ერთმანეთს, მაგრამ, მოდით,
ასო-ასო შევადაროთ, რომ გავიგოთ რა ხდება.

00:03:25.129 --> 00:03:29.713
მაგრამ ახლა უბრალოდ ქვევით ჩავალ
და ID-ს მივუთითებ HTML-ში

00:03:29.713 --> 00:03:33.930
და შემდეგ აქ დავაკოპირებ, იმისათვის
რომ აბსოლუტურად იდენტური იყოს.

00:03:33.930 --> 00:03:35.601
ახლა კი მუშაობს!

00:03:35.601 --> 00:03:40.045
ჩემს -ს აქვს ფონი.
მიხვდით რა შეიცვალა?

00:03:40.085 --> 00:03:44.474
შეიძლება მიხვდით, ჩვენ გვეწერა H,
უნდა დაგვეწერა h,

00:03:44.474 --> 00:03:47.083
ბრაუზერი მათ ერთნაირად ვერ აღიქვამს.

00:03:47.103 --> 00:03:50.341
უნდა ყოფილიყო h, რომ დამთხვეოდა HTML-ს.

00:03:50.341 --> 00:03:52.950
ID-ში მნიშვნელობა აქვს დიდ
და პატარა ასოებს.

00:03:52.950 --> 00:03:57.513
ყოველ ჯერზე იდენტურად უნდა გეწეროთ.

00:03:57.513 --> 00:04:01.753
მაგალითად, მე ყოველთვის პატარა
ასოებით ვწერ ID-ს, შემდეგ

00:04:01.753 --> 00:04:05.165
რომ არ დავიწყო ფიქრი დიდი ასო
გამოვიყენე თუ პატარა.

00:04:05.165 --> 00:04:08.404
ახლა საბოლოო გაფრთხილებას მოგცემთ.

00:04:08.404 --> 00:04:10.710
ID უნდა იყოს უნიკალური!

00:04:10.710 --> 00:04:13.444
თუ გექნებათ ორი თეგი ვებგვერდზე
იდენტური ID-თი,

00:04:13.444 --> 00:04:17.975
ბრაუზერმა შეიძლება ორივე შეცვალოს,
ან არც ერთი.

00:04:17.975 --> 00:04:20.501
თქვენ მგონი არ გინდათ ეს რომ მოხდეს.

00:04:20.501 --> 00:04:23.896
უნიკალური და აზრიანი ID.