Перейти к содержанию

<style>

ტეგი <style> (ინგ. style — სტილი) იგი გამოიყენება ვებ-გვერდის ელემენტების სტილის დასადგენად.

ელემენტი <style> უნდა იქნას გამოყენებული <head> კონტეინერის შიგნით. შეგიძლიათ მიუთითოთ რამდენიმე <style>.

დოკუმენტის მეტამონაცემები

სინტაქსი

<head>
  <style>
    ...;
  </style>
</head>

დამხურავი ტეგი აუცილებელია.

ატრიბუტები

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

media

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

სინტაქსი

<style media="all | print | screen | speech">
  ...;
</style>

მნიშვნელობა

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

შეგიძლიათ ერთდროულად დააყენოთ რამდენიმე მნიშვნელობა, ჩამოთვალოთ ისინი მძიმით.

ნაგულისხმევი მნიშვნელობა

  • screen

type

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

HTML4–ში ეს ატრიბუტი სავალდებულოა, HTML5–ში მისი გამოტოვება შესაძლებელია.

სინტაქსი

<style type="text/css">
  ...;
</style>

მნიშვნელობა

როგორც მნიშვნელობა გამოიყენება MIME-ტიპი — text/css.

ნაგულისხმევი მნიშვნელობა

  • text/css

სპეციფიკაციები

აღწერა და მაგალითები

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>STYLE, ატრიბუტი media</title>
    <style media="screen">
      .window {
        background: #333;
        border: 1px solid red;
        font-size: 0.9em;
        color: #fc0;
        padding: 10px;
      }
    </style>
    <style media="print">
      .window {
        border: 1px solid black;
        font-family: Arial;
        font-size: 0.9em;
        color: black;
        padding: 10px;
      }
    </style>
  </head>
  <body>
    <div class="window">
      ვეტერინარია - სავეტერინარო მედიცინა მეცნიერებათა ერთობლიობაა,
      რომელიც შეისწავლისცხოველთა დაავადებებს, მათთან ბრძოლისა და
      პრევენციის ღონისძიებებს, ცხოველთა პროდუქტიულობის ამაღლების საკითხებს,
      ადამიანების ზოონოზებისაგან დაცვის მეთოდებს.
    </div>
  </body>
</html>

ბმულები

  • ტეგი <style> MDN (ქართ.)