Მიმოხილვა CSS მემკვიდრეობის

როგორ CSS მემკვიდრეობა მუშაობს ვებ დოკუმენტებში

CSS- ის ვებსაიტის სტილის მნიშვნელოვანი ნაწილი გაგება მემკვიდრეობის კონცეფციას.

CSS მემკვიდრეობა ავტომატურად განისაზღვრება გამოყენებული ქონების სტილით. როდესაც თქვენ გამოიყურება up სტილის ქონების ფონის ფერი, თქვენ ნახავთ სექციაში სახელწოდებით "მემკვიდრეობის". თუ თქვენ საუკეთესო ვებ დიზაინერებს ჰგავს, თქვენ გაითვალისწინეთ, რომ სექცია, მაგრამ ის ემსახურება მიზნით.

რა არის CSS მემკვიდრეობა?

თითოეული ელემენტის HTML დოკუმენტი არის ნაწილი ნაყოფი და ყველა ელემენტს, გარდა თავდაპირველი ელემენტი აქვს მშობელს ელემენტს, რომელიც მას მოიცავს. როგორი შთაბეჭდილება მოახდინა ამ მშობლის ელემენტზე, შეიძლება გამოყენებულ იქნას ის ელემენტებთან, თუ თვისებები შეიძლება იყოს მემკვიდრეობით.

მაგალითად, ქვემოთ მოცემული HTML კოდი აქვს H1 ტეგით EM tag- თან ერთად:

ეს არის დიდი სათაურით

EM ელემენტი არის H1 ელემენტის შვილი და ნებისმიერი სტილის H1- ზე, რომლებიც მემკვიდრეობით მიიღება EM ტექსტში. მაგალითად:

h1 {font-size: 2em; }

მას შემდეგ, რაც შრიფტის ზომის საკუთრება მემკვიდრეობითაა, ტექსტს, რომელიც ამბობს "დიდი" (რაც არის თანდართული EM ტეგებში) იქნება იგივე ზომა, როგორც დანარჩენი H1. ეს იმიტომ ხდება, რომ ის მემკვიდრეობს CSS- ში არსებულ ღირებულებას.

როგორ გამოვიყენოთ CSS მემკვიდრეობა

მარტივი გზა გამოიყენოს ის გაეცნოს CSS თვისებები , რომლებიც და არ მემკვიდრეობით. თუ ქონება მემკვიდრეობით არის მიღებული, მაშინ თქვენ იცით, რომ ღირებულება დარჩება იგივე დოკუმენტში ყველა ბავშვის ელემენტისთვის.

ამის საუკეთესო საშუალებაა თქვენი ძირითადი სტილის დაყენება ძალიან მაღალი დონის ელემენტზე, როგორიც არის BODY. თუ თქვენი შრიფტის ოჯახი სხეულის საკუთრებაშია, მაშინ მემკვიდრეობის წყალობით მთელი დოკუმენტი შენარჩუნდება იმავე შრიფტით. ეს რეალურად გააკეთებს პატარა სტილისთვის, რომლებიც უფრო მარტივად მართავენ, რადგან არსებობს სულ უფრო ნაკლები სტილის რაოდენობა. მაგალითად:

სხეული {font-family: Arial, sans-serif; }

გამოიყენეთ მემკვიდრეობის სტილი ღირებულება

ყველა CSS საკუთრებაში შედის ღირებულება "მემკვიდრეობა", როგორც შესაძლო ვარიანტი. ეს ეუბნება ვებ ბრაუზერი, რომ მაშინაც კი, თუ ქონება ჩვეულებრივ მემკვიდრეობით არ იქნება, მას უნდა ჰქონდეს იგივე მნიშვნელობა, როგორც მშობელი. თუ თქვენ გაქვთ ისეთი სტილი, როგორიც არ არის მემკვიდრეობის ზღვარი, შეგიძლიათ გამოიყენოთ მემკვიდრეობითი ღირებულება შემდგომი თვისებების შესახებ, რათა მშობლისთვის იგივე ზღვარი მიანიჭოთ. მაგალითად:

სხეული {margin: 1em; } p {margin: მემკვიდრეობა; }

მემკვიდრეობა გამოთვლილ ღირებულებებს იყენებს

ეს მნიშვნელოვანია მემკვიდრეობით მიღებული ფასეულობებისათვის, როგორიცაა შრიფტის ზომები, რომლებიც იყენებენ სიგრძეს. კომპიუტერული ღირებულება არის ღირებულება, რომელიც დაკავშირებულია ვებ გვერდზე სხვა ღირებულების შედარებით.

თუ თქვენს BODY ელემენტზე 1em შრიფტის ზომა დაგიყენებთ, თქვენი მთელი გვერდი არ იქნება მხოლოდ 1 სმ ზომის. ეს იმიტომ, რომ ელემენტები, როგორიცაა სასაქონლო (H1-H6) და სხვა ელემენტები (ზოგიერთი ბრაუზერები compute მაგიდა თვისებები განსხვავებულად) აქვს ნათესავი ზომა ვებ ბრაუზერი. სხვა შრიფტის ზომის არარსებობის შემთხვევაში, ვებ ბრაუზერი ყოველთვის H1- ს სათაურში უჭირავს ყველაზე დიდ ტექსტს გვერდზე, რასაც მოყვება H2 და ასე შემდეგ. როდესაც თქვენს BODY ელემენტს განსაზღვრავს კონკრეტული შრიფტის ზომა, მაშინ გამოიყენება როგორც "საშუალო" შრიფტის ზომა და სათაურის ელემენტები გამოითვლება.

შენიშვნა მემკვიდრეობისა და ფონის თვისებების შესახებ

არსებობს მთელი რიგი სტილები, რომლებიც ჩამოთვლილი არ არის მემკვიდრეობით CSS 2 on W3C, მაგრამ ვებ ბრაუზერები მაინც მემკვიდრეობით ღირებულებებს. მაგალითად, თუ თქვენ დაწერა HTML და CSS: