CSS (Cascading Style Sheets) არის ვებდიზაინის ენა, რომელიც განსაზღვრავს HTML ელემენტების გარეგნობას. მისი სწავლა აუცილებელია როგორც დამწყები, ასევე პროფესიონალი დეველოპერებისთვის.
ამ ბლოგში წარმოგიდგენთ CSS-ის ყველა მნიშვნელოვან ინგლისურ ტერმინს, რომელიც ხშირად გვხვდება კოდის წერაში, მათ ტრანსლიტერაციას და ქართულ განმარტებასთან ერთად.
🔹 CSS-ის ძირითადი ტერმინები (ინგლისური სიტყვების ჩამონათვალი)
| სიტყვა | ტრანსლიტერაცია | განმარტება |
|---|---|---|
| selector | სელექტორ | HTML ელემენტის ამორჩევა |
| property | პროპერთი | სტილის მახასიათებელი |
| value | ველიუ | მახასიათებლის მნიშვნელობა |
| element | ელემენტ | HTML ტეგი |
| class | კლას | ელემენტის ჯგუფი |
| id | აი-დი | უნიკალური იდენტიფიკატორი |
| color | კალორ | ფერი |
| background | ბექგრაუნდ | ფონის ფერი ან გამოსახულება |
| font-size | ფონთ-საიზ | ტექსტის ზომა |
| font-family | ფონთ-ფემილი | ტექსტის შრიფტი |
| font-weight | ფონთ-ვეით | ტექსტის სისქე |
| text-align | ტექსტ-ელაინ | ტექსტის განლაგება |
| text-decoration | ტექსტ-დეკორეიშენ | ტექსტის გაფორმება (ხაზის დამატება და ა.შ.) |
| line-height | ლაინ-ჰაით | ხაზებს შორის მანძილი |
| letter-spacing | ლეთერ-სპეისინგ | ასოებს შორის მანძილი |
| word-spacing | ვორდ-სპეისინგ | სიტყვებს შორის მანძილი |
| padding | პედინგ | შიდა მანძილი ელემენტში |
| margin | მარჯინ | გარე მანძილი ელემენტს გარეთ |
| border | ბორდერ | ელემენტის საზღვარი |
| border-radius | ბორდერ-რეიდიუს | საზღვრის მომრგვალება |
| width | ვიდთ | სიგანე |
| height | ჰაით | სიმაღლე |
| max-width | მაქს-ვიდთ | მაქსიმალური სიგანე |
| min-width | მინ-ვიდთ | მინიმალური სიგანე |
| display | დისფლეი | ელემენტის ჩვენების ტიპი |
| visibility | ვიზიბილითი | ხილვადობა |
| opacity | ოპასითი | გამჭვირვალობა |
| position | პოზიშენ | ელემენტის პოზიციონირება |
| top | ტოპ | ზედა პოზიცია |
| bottom | ბოტომ | ქვედა პოზიცია |
| left | ლეფთ | მარცხენა პოზიცია |
| right | რაით | მარჯვენა პოზიცია |
| z-index | ზეი-ინდექს | სიღრმის პრიორიტეტი |
| overflow | ოვერფლოუ | ელემენტიდან გადმოსული კონტენტის მართვა |
| float | ფლოუთ | ელემენტის გვერდით განთავსება |
| clear | კლირ | float-ის გაუქმება |
| box-shadow | ბოქს-შედოუ | ჩრდილი ელემენტისთვის |
| text-shadow | ტექსტ-შედოუ | ტექსტის ჩრდილი |
| cursor | კურსორ | მაუსის კურსორის ტიპი |
| content | კონთენტ | ელემენტის შიგთავსი (საბეჭდი) |
| transition | ტრანზიშენ | სტილის ცვლილების ეფექტი |
| transform | ტრანსფორმ | ელემენტის გადახრა, გადაბრუნება |
| animation | ანიმეიშენ | ელემენტის ანიმაცია |
| keyframes | ქიფრეიმს | ანიმაციის ეტაპები |
| hover | ჰოვერ | როცა მაუსი მიაქვს ელემენტზე |
| focus | ფოკუს | ელემენტი აქტიური ხდება (მაგ input) |
| active | აქტივ | ღილაკის დაჭერის მომენტი |
| media | მედია | ეკრანის ზომაზე დამოკიდებული სტილები |
| responsive | რესპონსივ | მორგებული ყველა მოწყობილობაზე |
| flex | ფლექს | Flexbox განლაგების სისტემა |
| flex-direction | ფლექს-დაირექშენ | Flexbox ელემენტების მიმართულება |
| justify-content | ჯასტიფაი-კონთენტ | ჰორიზონტალური სწორება |
| align-items | ალაინ-아이ტემს | ვერტიკალური სწორება |
| gap | გაპ | სივრცე ელემენტებს შორის |
| grid | გრიდ | Grid განლაგება |
| grid-template-columns | გრიდ-თემფლეით-ქოლუმნს | სვეტების სტრუქტურა |
| grid-template-rows | გრიდ-თემფლეით-როუზ | მწკრივების სტრუქტურა |
| auto | აუტო | ავტომატური მნიშვნელობა |
| inherit | ინჰერით | მშობლისგან მემკვიდრეობით მიღება |
| initial | ინიშელ | საწყისი მნიშვნელობა |
| !important | იმპორტანტ | მნიშვნელობის უპირატესობა |
CSS-ის ტერმინების ცოდნა მნიშვნელოვანია ვებსაიტების თანამედროვე დიზაინის შესაქმნელად. ეს სია დაგეხმარება სწრაფად აითვისო ან გაიხსენო ძირითადი სტილის მახასიათებლები.