CSS-ის შესავალი, დასაწყისი

HTML, CSS-ის ინტენსიური კურსი

კურსის დასრულების შემდეგ შეძლებთ HTML CSS-ით ააწყოთ კომპლექსური ვებ გვერდები.

როგორც წინა გაკვეთილში ვისაუბრეთ HTML წარმოადგენს ვებგვერდის სტრუქტურას (ტანს), ხოლო დღეს ვისაუბრებთ მის გალამაზებაზე და ჩვენი სასურველი დიზაინის მიცემაზე.

ამისთვის გამოიყენება CSS ენა, რომელიც იშიფრება როგორც: Cascading style sheet.

CSS-ის დახმარებით ჩვენ შეგვიძლია დოკუმენტში გავალამაზოთ ნებისმიერი ჩვენთვის სასურველი ელემენტი, სანამ დავიწყებთ მოდი ვისაუბროთ თუ რამდენი ტიპის CSS არსებობს.

CSS არსებობს 3 ტიპის ესენია:

Inline CSS
Internal or Embedded CSS
External CSS

გაკვეთილის ახსნის ვიდეოში მე ვისაუბრე 2 ტიპის CSS-ზე ესენია Inline და External, მოდი ვნახოთ ორივე ტიპის მაგალითი

Inline ტიპის CSS

<h1 style="color: red">My heading</h1>

როგორც მაგალითშია ნაჩვენები inline ტიპის CSS-ები იწერება HTML თეგის style ატრიბუტში.

External ტიპის CSS

<html>
  <head>
    <link rel="stylesheet" href="css_file_path">
  </head>
<html>

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

როგორ შევუცვალოთ სტილი კონკრეტულ ელემენტს external CSS-ის დახმარებით?

h1 {
  color: red;
}

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

მოცემული ჩანაწერი HTML დოკუმენტში ყველა <h1> თეგს შეუცვლის ტექსტის ფერს წითლად