-
ჩვენ დავბრუნდით და ახლა ჩვენს გვერდზე
არის ცნობილი ნახატების სიების ბმულები.
-
CSS იწყება წესით, რომ ძირითად ნაწილში
მთელი ტექსტის ფონტი არის sans-serif
-
შემდეგ გვაქვს წესი, რომელიც ცვლის
და პარაგრაფების სტილს.
-
შემდეგ კიდევ რამდენიმე წესი გვაქვს,
რომელიც მანამდე, ალბათ, არ გინახავს.
-
ყველა იწყება ასე:
a: რაღაც–სიტყვა
-
რას ნიშნავს a: ?
რას მიესადაგება ეს წესები?
-
ყველაფერი, რაც ასე გამოიყურება
მიემართება ფსევდო–კლასებს.
-
ფსევდო–კლასი ირჩევს ელემენტებს ინფორმაციით
რომელიც არაა მოცემული გვერდის სტრუქტურაში
-
ან უბრალოდ ვერ გადმოიცემა სხვს სელექტორებით.
-
აქ ფსევდო–კლასებს ვირჩევ ბმულების სტილის
შესაცვლელად მათი მდგომარეობის მიხედვით.
-
ფსევდო–კლასი link აირჩევს ყველა ბმულს,
რომელზეც მომხმარებელი ჯერ არ გადასულა.
-
ჩვეულებრივ, ასეთი ბმული ლურჯია.
-
ფსევდო–კლასი visited აირჩევს იმ ბმულებს,
რომელთაც მომხმარებელი უკვე ეწვია.
-
ასეთ ბმულებს ბრაუზერები, წესით,
იისფრად აღნიშნავენ.
-
თუ ძალიან გვინდა,
შეგვიძლია შევცვალოთ ფერები.
-
მაგრამ ამისთვის კარგი მიზეზი უნდა გვქონდეს
-
ადამიანები შეეჩვივნენ ლურჯსა და იისფერს და
ასე განსაზღვრავენ, რა ნახეს უკვე, და რა – ჯერ არა.
-
ზოგადად, ეს ძალიან სასარგებლო ფუნქციაა
-
და ტყუილ–უბრალოდ არ ღირს მისი შეცვლა.
-
ამიტომ, მე უბრალოდ წავშლი ამ წესებს.
-
მათ შეცვლას, ჩემი აზრით, წაშლა სჯობს.
-
შემდეგი წესი არის a:hover
-
hover ფსევდო–კლასი აირჩევს ელემენტს, თუ
მომხმარებელი მას მაუსს მიუახლოვებს.
-
თვისებები ამ ელემენტს მხოლოდ ასეთ
შემთხვევაში გადაეცემა.
-
დააპაუზეთ ვიდეო და ნახეთ, რა მოხდება
თუ ბმულებთან მაუსს მიიტანთ.
-
მიდით, მე დაგიცდით.
-
ნახეთ, როგორ იცვლიდა ფონი ფერს?
ძალიან მაგარი ეფექტია.
-
ამ hover პსევდო–კლასის გამოყენება შეგიძლია
ნებისმიერ ელემენტზე, არა მარტო ბმულზე
-
მაგრამ ის არ იმუშავბს ყველა მოწყობილობაზე
-
მაგალითად, თუ ტელეფონით ხარ, მაუსს ვერ
მიიტან: ან ეხები, ან არა
-
კარგია, როცა ეს ეფექტი ბონუსად გაქვს,
მაგრამ სერიოზული ფუნქცია არ უნდა დააკისრო
-
გადავიდეთ ბოლო ორზე.
ისინი გვანან hover-ს
-
მოქმედებენ მომხმარებლის მიმდინარე
ქცევის შესაბამისად
-
პსევდო–კლასი active ირჩევს მიმდინარე
გააქტიურებულ ელემენტებს
-
მაგალითად, ბმულს, რომელსაც ზუსტად ახლა
აჭერენ, გადასვლამდე
-
პსევდო–კლასი focus ირჩევს ფოკუსში მყოფ
ელემენტებს;
-
მაგალითად, თუ tab ღილაკს იყენებ
ინტერფეისზე სამოძრაოდ
-
დააპაუზე ვიდეო და სცადე გადახვიდე ბმულებზე
ან გამოიყენო მათ ირგვლივ tab ღილაკი
-
შეამჩნიე, როგორ იცვლებოდა ფონი?
-
hover, active და focus – სამივესთვის იგივე
თვისება შევარჩიე, იმიტომ რომ მსგავსი ქმდებებია
-
მომხმარებელი რაღაცნაირად ზემოქმედებს
ბმულზე
-
ბევრი დიზაინერი სწორედ ამის გამო იყენებს
სამივესთვის ერთსა და იმავე თვისებას
-
დავუშვათ, მინდა შევცვალო ამ ფონის
ფერი
-
შემიძლია შევცავლო ის ცალ–ცალკე
ყოველისთვის
-
ან გამოვიყენო ის, რაც ახლახან ვისწავლეთ
-
შემიძლია გავაერთიანო სელექტორები, ჩავსვა
ისინი ერთ წესში და გამოვყო მძიმეებით
-
აქ დავსვამ მძიმეს და ჩავსვამ
"a:active", "a:focus".
-
ახლა წავშალოთ ესენი და შევცვალოთ სამივე
ერთდროულად. კარგია
-
პსევდო–კლასები ამ რამდენიმეთი არ იწურება
-
შეგიძლია დაძებნო დანარჩენები ინტერნეტში
-
ან დაიცადო, სანამ აქ გასწავლით მეტს.
