CSS სახელმძღვანელო

CSS - დამწყებებისთვის

CSS - მიმოხილვა CSS - სინტაქსი CSS - სელექტორები CSS - შემოტანა CSS - ტექსტური თვისებები CSS - კომენტარი CSS - ფონები CSS - საზღვრები CSS - სიმაღლე და სიგანე CSS - ფონტის შემოტანა CSS - შიდა დაშორება (PADDING) CSS - გარე დაშორება (MARGIN) CSS - სიები CSS - ბმულები CSS - DISPLAY CSS - პოზიციები CSS - Z-INDEX CSS - OVERFLOW CSS - Opacity CSS - ერთეულები CSS - !important

CSS - სელექტორები

CSS - კომბინატორები CSS - ფსევდო კლასები CSS - ფსევდო ელემენტები CSS - ატრიბუტი სელექტორი

CSS - FLEXBOX

FLEXBOX - მიმოხილვა FLEXBOX - კონტეინერი FLEXBOX - ელემენტები

CSS - Responsive

Responsive - მიმოხილვა Responsive - პრინციპები @media - ქუერები

CSS - საშუალო დონე

CSS - ფილტრები CSS - object-fit CSS - გრადაციები CSS - ფონის თვისებები CSS - შუქჩრდილები CSS - 2D/3D ტრანსფორმაციები CSS - გადასვლები CSS - კურსორის თვისებები CSS - ანიმაციები

CSS - კომპონენტები

CSS - სანავიგაციო მენიუ (NAVBAR) CSS - ფორმა CSS - ღილაკები CSS - ბარათი (card) CSS - CHECKBOX & RADIO

CSS ფაილში ფონტის შემოტანის ორი მეთოდი არსებობს CDN (გარე რესურსიდან) და ლოკალური

ფონტის შემოტანა CDN - მეთოდით

ფონტები შეგვიძლია ავიღოთ სხვადასხვა ვებ საიტიდან, მაგ: Google Font , Fonts.ge , Web-fonts.ge და სხვა
CSS ფაილში ვაიმპორტებთ ბმულს რომელსაც , ვებ გვერდი გვაწვდის:

მაგალითი:

@import url("//cdn.web-fonts.ge/fonts/bpg-square/css/bpg-square.min.css");

 .bg-green{
    font-family: "BPG Square", sans-serif;
  }

განმარტება , @import url() თვისებას შემოაქვს ფაილი ბმულის სახით , ხოლო font-family თვისების მნიშვნელობა

კონკრეტული აღნიშნავს ფონტის დასახელებას , sans-serif აღნიშნავს ფონტის სტილს

ფონტის შემოტანა ლოკალური მეთოდით

პირველ რიგში საჭიროა ფონტის ჩამოტვირთვა , თუ არქივშია ამოარქივება და ვებ გვერდის მთავარ ფოლდერში განთავსება, სასურველია რომ ფონტებისთვის და ზოგადად ფაილებისთვის შევქმნათ ახალი ფოლდერები

ფონტის იმპორტი css ფაილში :

 @font-face {
  font-family: "BPG Square";
  src: url('fonts/bpg-square-webfont.woff');
 }

განმარტება:

@font-face შიგნით არსებული font-family თვისებაში ფონტს ვარქმევთ ჩვენთვის სასურველ სახელს,

src:url('') მნიშვნელობაში კი ვუთითებთ ფაილის ლოკაციას და დასახელებას

ახლა უკვე შეგვიძლია იგივე პრინციპით მივანიჭოთ თვისება ელემენტს როგორც cdn შემთხვევაში

მაგალითი:

 .container{
    font-family: "BPG Square";
  }