ტეგი აღნიშნავს რიგების ჯგუფს ცხრილში. ატრიბუტები ALIGN და VALIGN

09.11.2015


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

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

ვფიქრობ, თქვენ დაალაგეთ, ახლა თქვენ უნდა წაიკითხოთ და შექმნათ ცხრილი.

რა არის ძირითადი ტეგები ცხრილში?

○ ტეგი მაგიდა
ეს არის სათავე კონტეინერი ცხრილის შესაქმნელად, რომლის შუაშია განთავსებული ცხრილის სხვა ელემენტები, როგორიცაა სვეტები და რიგები.
დახურვის ტეგი სავალდებულოა.

○ ტეგი

კონტეინერის შუაში

……
რიგებად დალაგებული:

სტოვპჩიკები იქმნება ტეგის დახმარებით .
დახურვის ტეგი სავალდებულოა.

უვაგა:ამ ტეგების გამოყენების გარეშე ცხრილის შექმნა შეუძლებელია.

ახლა შევეცადოთ სწრაფად გავარკვიოთ თეორია და შევქმნათ ცხრილი პრაქტიკაში.

ზავდანნია:შექმენით ცხრილი ერთ რიგში, ასე რომ იქნება სამი სვეტი.

რიგი -1 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3

ზავდანნია:შექმენით ცხრილი სამი მწკრივით და სამი სვეტით.

რიგი -1 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3
რიგი -2 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3
რიგი -3 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3

რომელ მომენტამდეა თქვენთვის ყველაფერი ნათელი? თუ გონიერი არ ხარ, ასწიე ხელი! ჰო, ყველა გონს მოვიდა, გავაგრძელოთ.

ახლა მოდით შევხედოთ ცხრილის ატრიბუტებს.

* ატრიბუტები

ცხრილებს შორის HTML-ში

შეგიძლიათ იხილოთ ცხრილი ტეგის წინ

გაჭედვა ატრიბუტი "საზღვარი» .

რა არის ატრიბუტის მნიშვნელობა? « საზღვარი» „0“ არ იქნება ხილული კორდონისთვის, თუ ის არ არის დაწერილი ტეგის წინ

ატრიბუტი "საზღვარი", მაგიდასთან კორდონი არ ჩანს.

ცხრილებს შორის HTML - საიტი

რიგი -1 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3

შედეგი:

სცადეთ შეცვალოთ მნიშვნელობები ატრიბუტში "საზღვარი" on "10" .

როგორ ვიკვებოთ სუფრაზე შუაგულები

ცხრილის შუა მნიშვნელობების დასაკავშირებლად აირჩიეთ ატრიბუტები "კოლსპანი"და "rowspan" ტეგზე < ტდ> .

  • colspan – შუა ჰორიზონტალურად დამაკავშირებელი;
  • rowspan - დაყოფა შუა ვერტიკალურად.

მნიშვნელობებში მიუთითეთ რამდენი შუალედი უნდა დააკავშიროთ.

რიგი 1 სტოვპჩიკი 1
რიგი 2 სტოვპჩიკი 1 რიგი 2 სტოვპჩიკი 2

შედეგი:

რიგი 1 სტოვპჩიკი 1 რიგი 1 სტოვპჩიკი 2
რიგი 2 სტოვპჩიკი 1

შედეგი:

უფრო დიდი დასაკეცი მარაგი:

ცხრილები HTML - ვებსაიტში

რიგი -1 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3
რიგი -2 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3 სტოვპჩიკი 4

შედეგი:

როგორ გავზარდოთ მანძილი მაგიდის ცენტრებს შორის

ტექსტსა და შუას შორის სივრცის გასაზრდელად, დაწერეთ ატრიბუტი "უჯრედის შიგთავსი"მონიშვნა

"cellpadding" ატრიბუტის მნიშვნელობებში მიუთითებთ, რომ ის ხელმისაწვდომი იქნება

რიგი 1 სტოვპჩიკი 1 სტოვპჩიკი 2

შედეგი:

ცხრილის შუა ნაწილებს შორის მანძილის გასაზრდელად აირჩიეთ ატრიბუტი "უჯრედების ინტერვალი"მონიშვნა

ატრიბუტის მნიშვნელობა "უჯრედების ინტერვალი"შენ მეუბნები შუაგულებს შორის დავდგე

რიგი 1 სტოვპჩიკი 1 სტოვპჩიკი 2

შედეგი:

როგორ შევქმნათ HTML ცხრილის ფონი

HTML ცხრილის ფონის შესაქმნელად, ვიკორიზეთ ტეგზე

і

შემდეგი ატრიბუტები:

  • BGCOLOR - ფონის ფერი მთელი მაგიდისთვის ან წაისვით კანზე. ფერი მითითებულია კოდით და სიტყვით.
  • ფონი - მაგიდის ფონი შეივსება ბავშვით.
ცხრილები HTML - ვებსაიტში
რიგი -1 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3
რიგი -2 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3 სტოვპჩიკი 4

შედეგი:

როგორ ჩავსვათ სურათი HTML ცხრილში

სურათის ჩასმა HTML ცხრილში, ტეგს შორის

ჩასმა ტეგი .

რიგი 1 ოთახი 1 შუა 2

შედეგი:

მნიშვნელობები მითითებულია პიქსელებში (px) ან პიქსელებში (%)

ვირუსი ერთად HTML ცხრილში

HTML ცხრილის შესატყვისად, მოძებნეთ ტეგი ატრიბუტი "გასწორება"і Valign :

გასწორება- ჰორიზონტალური გასწორება მაგიდასთან ერთად.
მნიშვნელობა:

  • დატოვა - დააჭირეთ ერთად მარცხენა მხარეს (დასუფთავებისთვის);
  • ცენტრი ჩასმა ცენტრში;
  • უფლება - დააჭირეთ ერთმანეთს მარჯვენა მხარეს

VALIGN- ვერტიკალური განლაგება მაგიდის ნაცვლად.
მნიშვნელობა:

  • ზედა დაწნეხილი დაწვის ნაცვლად;
  • ქვედა დააჭირეთ ქვემოთ ქვემოთ;
  • შუა მოათავსეთ შუაში
ტექსტი

შუა დანარჩენისთვის ნაცვლად ჰორიზონტალურად გასწორებული მარჯვენა კიდის გასწვრივ, ვერტიკალურად - დაჭერით ბოლოში
ამის ნაცვლად, ჰორიზონტალურად გასწორებულია მარცხენა კიდეზე, ვერტიკალურად - დაჭერით ზევით ნაცვლად ჰორიზონტალურად გასწორებული ცენტრში, ვერტიკალურად დაჭერილი შუაში

შედეგი:

როგორ მოვათავსოთ HTML ცხრილის ცენტრში

მაგიდის ცენტრისთვის საჭიროა მაგიდის გარშემო ტეგით

:

მაგიდის კოდი

რიგი -1 / სტოვპჩიკი 1 სტოვპჩიკი 2 სტოვპჩიკი 3

დამატებითი და მთავარი ტეგები ცხრილის წინ

მაგიდა საიტისთვის
სახელი 1 სახელი 2
1 2

შედეგი:

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

წინ შესვლა
შეტევითი რეკორდი

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

ოტიე, როგორ შევქმნათ მარტივი ცხრილი HTML-ში?
ცხრილის შესაქმნელად, თქვენ უნდა დაამატოთ სამი ტეგი:

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

ცხრილი შედგება რიგებისგან

რიგი 1 რიგი 1
რიგი 2 რიგი 2
რიგი 3 რიგი 3
შუა 1 შუა 2
შუა 1 შუა 2
შუა 1 შუა 2

TR ქმნის ახალ რიგს ცხრილში. ტყვეობის ტეგი ობოვიაკოვი.

თ.დ. მე ვქმნი ახალ შუას რიგში. ტყვეობის ტეგი ობოვიაკოვი.

მოდით შევხედოთ კონდახს, რომ უკეთ გავიგოთ ნათქვამი:

ცხრილები HTML-ში

რიგი 1 შუა 1 რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2
რიგი 3 ოთახი 1 რიგი 3 ოთახი 2

ღერძის შედეგი:

რიგი 1 შუა 1 რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2
რიგი 3 ოთახი 1 რიგი 3 ოთახი 2

ნება მომეცით აგიხსნათ ყველაფერი.
ტეგი იხსნება ახალი ცხრილის სკინგის წინ

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

რიგის დახურვა ტეგით .
ჩვენ ვხსნით კიდევ ერთ რიგს ტეგით
რიგის დახურვა ტეგით .
მესამე რიგს ვხსნით ტეგით და ჩადეთ ორი შუაში ახალ ხაზში.
რიგის დახურვა ტეგით .
მაგიდის დახურვა ტეგით
რიგი 1 შუა 1 რიგი 1 შუა 2
.

მგონი დაშორდი? დამავიწყდა რა არის ეს ატრიბუტი საზღვარი, რომელიც მე ვიკორისტა ვარ ერთდროულად iz tag

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

გაოცდით კონდახების რაოდენობით შემოქმედების მაგიდადა შეგიძლიათ უფრო შორს წახვიდეთ:

ცხრილები HTML-ში

რიგი 1 ოთახი 1
რიგი 2 შუა 1

შედეგი:

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

ზედიზედ ტეგებს შორის სურათის ჩასმა.

ცხრილები HTML-ში

რიგი 1 ოთახი 1 რიგი 1 ოთახი 2

შედეგი:

რიგი 1 ოთახი 1 რიგი 1 ოთახი 2

როგორ ვჭამოთ სუფრაში შუალედები?

ცხრილის რიცხვების დასაკავშირებლად, თქვენ უნდა აირჩიოთ შემდეგი ატრიბუტები:
COLSPAN- ეს ნიშნავს ხალხის რაოდენობას.
სარეკლამო მუშაკებისთვის ღირებულება არის 1.
ROWSPAN- ეს ნიშნავს რიგების რაოდენობას.
სარეკლამო მუშაკებისთვის ღირებულება არის 1.


ერთად შუაზედა რიგში დამატებითი ატრიბუტის უკან კოლსპანი :

ცხრილები HTML-ში

რიგი 1 ოთახი 1+2
რიგი 2 შუა 1 რიგი 2 ოთახი 2

შედეგი:

როგორ დავაყენო მაგიდის ზომა?

ცხრილის სიმაღლისა და სიგანის დასაყენებლად გამოიყენეთ შემდეგი ატრიბუტები:

სიგანე- მაგიდის სიგანე. ზომა მითითებულია პიქსელებში ან ასობით.
HEIGHT- მაგიდის სიმაღლე. ზომა მითითებულია პიქსელებში ან ასობით.

ცხრილები HTML-ში

რიგი 1 შუა 1რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2

შედეგი:

ვირუსი ერთად მაგიდაზე

მაგიდის შუაში მნიშვნელობის დასამატებლად (ტექსტი, სურათები) ნაცვლად შეგიძლიათ გამოიყენოთ შემდეგი ატრიბუტები:

გასწორება- ჰორიზონტალური გასწორება მაგიდასთან ერთად.
ატრიბუტის წინ გასწორებამნიშვნელობა ენიჭება: დარჩა (დასუფთავებისთვის), ,უფლება.
მარცხენა -
დააჭირეთ ერთად მარცხენა მხარეს;
ცენტრი -ჩასმა ცენტრში;
მარჯვენა -
დააჭირეთ ერთმანეთს მარჯვენა მხარეს

VALIGN- ვერტიკალური განლაგება მაგიდის ნაცვლად.
ატრიბუტის წინ VALIGNმნიშვნელობა ენიჭება: ზედა, ქვედა, შუა.
ზედა დაწნეხილი დაწვის ნაცვლად;
ქვედა დააჭირეთ ქვემოთ ქვემოთ;
შუა მოათავსეთ შუაში

ცხრილები HTML-ში

რიგი 1 შუა 1 რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2

შედეგი:

როგორ შევქმნათ მაგიდის ფონი?

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

BGCOLOR- შეღებეთ მთელი მაგიდის ფონი ან წაისვით კანზე. ფერი მითითებულია კოდით და სიტყვით.
ფონი-მაგიდის ფონი ბავშვით გაივსება.

უვაგა:თუ გსურთ დააყენოთ ფონის ფერი ან ფონის ფერი მთელი ცხრილისთვის, თქვენ უნდა დააყენოთ ატრიბუტები სათაურში

. და თუ მხოლოდ შუაში, მაშინ ტეგში (ცხრილის რიგი) და მთავრდება ტეგით. რიგის დასასრული ჩარჩოშია წყვილი ტეგებით (ცხრილის მონაცემები) ან (მაგიდის სათაური). მონიშნეთ . საბოლოო კოდები, іშეიძლება გამოტოვდეს. ამ განყოფილებაში მწკრივის ან ნაკვეთების აღწერის დასასრული არის შემტევი მწკრივის ან ნაკვეთების დასაწყისი ან ცხრილის დასასრული. მაგიდის დასასრული ტეგი
.

უფრო სწრაფი გაგებისთვის, შეხედეთ კონდახს:

ცხრილები HTML-ში

რიგი 1 შუა 1 რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2

შედეგი:

უვაგა:თუ სურათის ზომა შეკვეთის ფასზე ნაკლებია, ის განმეორდება შეკვეთის სრულად შევსებამდე. თუ სურათი უფრო დიდია ვიდრე ყუთის ზომა, სურათის ფონი ამოიჭრება ყუთის ზომის მიხედვით.

და ბოლოს უფრო მეტს მოგიყვებით ორი ყავისფერი ატრიბუტი.

თუ გსურთ მაქსიმალური სარგებლობის მიღება შუალედიდან, შემდეგი ატრიბუტები დაგეხმარებათ:

CELLPADDING- დადექით კანის ჩარჩოს შორის შუა htmlმაგიდა და მისი მასალა.

ცხრილები HTML-ში

რიგი 1 შუა 1 რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2

შედეგი:

რიგი 1 შუა 1 რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2

CELLSPACING- დადგით გემის შუაგულების კორდონებს შორის.

ცხრილები HTML-ში

რიგი 1 შუა 1 რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2

შედეგი:

რიგი 1 შუა 1 რიგი 1 შუა 2
რიგი 2 შუა 1 რიგი 2 ოთახი 2

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

ნაწილი 4

ცხრილები HTML-ში

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

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

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

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

ბრინჯი . 4.1. ტიპიური HTML ცხრილის მაგალითი


ბრინჯი . 4.2. კონდახის მაგიდა ჩარჩოების გარეშე

უმარტივესი HTML ცხრილების შექმნა

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

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

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

ტყავის რიგი იწყება ტეგით

ііვიკორისტი გამოიყენება ცხრილის შუა სათაურებისთვის და - საშუალო მონაცემებისთვის. ვიკორისტანის მნიშვნელობა, უპირველეს ყოვლისა, მდგომარეობს შრიფტის ტიპში, რომელსაც ვიკორისტი იყენებს შუაშის ნაცვლად საჩვენებლად, ასევე მონაცემების შუაში განთავსებაში. ტიპის გალიების ნაცვლად ის ნაჩვენებია სქელი შრიფტით და ცენტრში (ALIGN=CENTER, VALIGN=MIDDLE). შუაები მონიშნულია ტეგით გარეცხვის შემდეგ ნაჩვენებია მონაცემები, ორიენტირებული მარცხნივ (ALIGN=LEFT) და შუაში (VALIGN=MIDDLE) ვერტიკალური მიმართულებით.

ტეგები

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

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

ცხრილს შეიძლება ჰქონდეს სათაური, რომელიც შეესაბამება რამდენიმე ტეგს і. ცხრილის სათაურის აღწერა შეიძლება გამოჩნდეს ტეგების შუაში

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

როდესაც შეფუთულია, ცხრილის სათაურის ტექსტი გაფართოვდება მის ზემოთ (ALIGN=TOP) და ცენტრშია ჰორიზონტალურად.

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

ეს განცხადებები სრულიად საკმარისია ელემენტარული ცხრილების ჩასართავად. მოდით შევხედოთ უმარტივეს ცხრილს, რომელიც შედგება ორი მწკრივისა და ორი სვეტისგან, როგორც ნაჩვენებია ნახ. 4.3.

უმარტივესი ცხრილის მაგალითი

შუა რიგი 1 1 შუა 2 რიგი 1
შუა რიგი 1 2 შუა 2 რიგი 2


ბრინჯი. 4.ზ.უმარტივესი ცხრილის მაგალითი

ცხრილი წარმოდგენილია გვერდზე

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

ცხრილის სათაური

ცხრილის სათაურის ტეგი ერთადერთი სწორი პარამეტრია ALIGN, რომელიც ადგენს მნიშვნელობას TOP (სათაური ცხრილის ზემოთ) ან BOTTOM (სათაური ცხრილის ქვემოთ). ALIGN პარამეტრი შეიძლება გამოტოვდეს, რაც მიუთითებს მნიშვნელობაზე ALIGN=TOP. ჰორიზონტალურ განლაგებაში, ცხრილის სათაური ყოველთვის ცენტრშია. ცხრილს შეიძლება ჰქონდეს სათაური. როგორც ცხრილის სათაური უმეტეს არჩევანში, გამოიყენება მარტივი ტექსტი, რომელიც რეგულირდება HTML სპეციფიკაციით, ტეგებს შორის. іდასაშვებია ნებისმიერი HTML ელემენტის ჩაწერა განყოფილების მსგავსი . მოდით შევხედოთ ცხრილის სათაურის ჩანაწერს:

სათაური, რომელიც ჩანს ცხრილის ბოლოში

თუ ზემოთ მოცემულ მაგალითს დაემატება სათაურის ეს აღწერა, ცხრილი გამოჩნდება, როგორც ნაჩვენებია ნახ. 4.4.


ბრინჯი. 4.4.ცხრილი სათაურით

Microsoft ბრაუზერი Internet Explorerვიმედოვნებ დამატებითი შესაძლებლობებისათაურის ასარჩევად. ALIGN პარამეტრი საშუალებას აძლევს LEFT, CENTER და RIGHT მნიშვნელობებს ჰორიზონტალური გასწორებისთვის იმავე თანმიმდევრობით, როგორც სხვა აღწერილი მნიშვნელობები. მნიშვნელოვანია, რომ ეს არის ერთ-ერთი იშვიათი ვარიაცია, რადგან ALIGN პარამეტრი შეიძლება დარეგულირდეს როგორც ჰორიზონტალური, ასევე ვერტიკალური გასწორებისთვის. მაგალითად, ჩაწერა ALIGN=RIGHT უზრუნველყოფს, რომ სათაური აიძულოს მარჯვენა მხარეს და განთავსდეს ცხრილის ზემოთ. თუ დაწერთ ALIGN=BOTTOM, მაშინ სათაური გამოჩნდება ცხრილის ქვეშ. თუმცა, რამდენიმე ჩანაწერი ერთ ALIGN სათაურში მიუღებელია. დამატებითი ინფორმაცია დაინერგა სპეციალური პარამეტრივერტიკალური გასწორებისთვის - VALIGN, რომელიც დაყენებულია TOP ან BOTTOM. მაგალითად, ცხრილის ბოლოში ნაჩვენები სათაურისთვის მარცხენა რიგებით, აღწერა ასე გამოიყურება:

მიემართება, შემოტრიალდა ქვემოთ და მარცხნივ

ცხრილი სათაურის ამ აღწერით Microsoft Internet Explorer-ში გამოჩნდება ასე (ნახ. 4.5). თუ შეხედავთ ამ მაგალითს Netscape-ში, სათაური განთავსდება მაგიდის უკან, მაგიდის ზემოთ და ჰორიზონტალური მიმართულებით.


ბრინჯი. 4.5.ცხრილის სათაურის ჰორიზონტალური გასწორება Microsoft Internet Explorer ბრაუზერში

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

ტეგის პარამეტრები

მთავარი ტეგი, რომელიც იქმნება შექმნილ ცხრილში, არის ტეგი

. შეგიძლიათ გამოიყენოთ დაბალი პარამეტრები, რომელთაგან ზოგიერთი შეიძლება გამოტოვოთ. აკრიფეთ მისაღები პარამეტრებიდარჩით თქვენს ბრაუზერში. ექვემდებარება HTML სპეციფიკაციას აბსტრაქტში
შესაძლებელია შემდეგი პარამეტრების არჩევა: BORDER, CELLSPACING, CELLPADDING, WIDTH, ALIGN. NetScape და Microsoft Internet Explorer ბრაუზერები საშუალებას გაძლევთ შეცვალოთ HEIGHT და BGCOLOR პარამეტრები ხუთი პარამეტრის გარდა. სხვა ბრაუზერები ასევე საშუალებას გაძლევთ დააყენოთ სხვა პარამეტრები. მოდით შევხედოთ ტეგის ძირითადი პარამეტრების მნიშვნელობას
.

BORDER პარამეტრი

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

ცხრილში ჩარჩოების დასამატებლად, თქვენ უნდა შეიყვანოთ კოდი

BORDER პარამეტრი, რომელსაც შეიძლება ჰქონდეს რიცხვითი მნიშვნელობა.

Მაგალითად,

ან კიდევ
.

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

ცხრილის კონდახი 10 პიქსელიანი საზღვრით ნაჩვენებია ნახ. 4.6.


ბრინჯი. 4.6.ცხრილი 10 პიქსელიანი საზღვრით

HTML 3.0 სპეციფიკაციაში არ არის მითითებული BORDER პარამეტრის მნიშვნელობა. ეს აღარ შედის HTML 3.2-ში. ამრიგად, Microsoft Internet Explorer-ის ადრეული ვერსიები არ იძლეოდა რიცხვითი მნიშვნელობების შეყვანის საშუალებას.

მნიშვნელოვანია, რომ თუ BORDER პარამეტრი აკლია, ჩარჩოები არ იყოს მონიშნული, მაგრამ მათ ქვეშ არსებული სივრცე დაკარგულია (ასეა Netscape-ის შემთხვევაშიც). ცხრილის ჯამური ზომა არ იცვლება BORDER პარამეტრის არარსებობის გამო (პრობლემა არის ის, რომ მითითებულია BORDER=0). ამრიგად, მინიმალური მანძილი ორ კოსმოსურ ცენტრს შორის ამ შემთხვევებში იგივეა, რაც ორი პიქსელი. შესაძლებელია იაკმოგის ცენტრის მიახლოება ერთთან BORDER=0-ის დაყენებით, რაც ნიშნავს, რომ ჩარჩოები არ არის. ზოგიერთ ბრაუზერს შეიძლება არ ჰქონდეს BORDER პარამეტრის ციფრული მნიშვნელობის მითითების მხარდაჭერა, ამიტომ ნულზე ნაკლები მნიშვნელობა იგნორირებული იქნება და ცხრილი გამოჩნდება საზღვრებს გარეთ.

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

Netscape ბრაუზერზე განთავსებული სამივე აპლიკაცია განსხვავებულად გამოჩნდება. პატივისცემით, აქ არის უნიკალური ირონია, თუ არ შეგიძლიათ ისაუბროთ აზროვნების მიღმა არსებულ მნიშვნელობაზე. მესამე კონდახი, რომელშიც BORDER პარამეტრი გამოტოვებულია, დიფერენცირებულია ნებისმიერი კონდახისგან, რომელსაც აქვს ეს პარამეტრი. Microsoft Internet Explorer-ისთვის სხვა და მესამე აპლიკაციები იდენტურია, რომლისთვისაც BORDER მნიშვნელობა ნულის ტოლია.

CELLSPACING პარამეტრი

პარამეტრის ჩაწერის ფორმა: CELLSPACING=num, სადაც num არის პიქსელის პარამეტრის რიცხვითი მნიშვნელობა, რომელიც შეიძლება გამოტოვოთ. მნიშვნელობა num ნიშნავს მანძილს მიმდებარე ცენტრებს შორის (უფრო ზუსტად, ცენტრების ჩარჩოებს შორის) როგორც ჰორიზონტალურად, ასევე ვერტიკალურად. დაქორწინების მნიშვნელობაზე ზრუნავენ თანაბარი წყვილები. გთხოვთ გაითვალისწინოთ, რომ სხვა სისტემებში, ცხრილის შუას აქვს მკაფიო საზღვარი. HTML ცხრილებში მათ უკან ადგილი არ არის, რაც აშკარად ჩანს მცირე მასშტაბით (ნახ. 4.6). როდესაც მითითებულია CELLSPACING=0, მეზობელი შუაგულების ჩარჩოები დაიშლება და წარმოქმნის ერთი ცხრილის ბადეს (ნახ. 4.7).


ბრინჯი. 4.7.ცხრილი CELLSPACING=0 მნიშვნელობებით

CELLPADDING პარამეტრი

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

ნახ. 4.8 ჩვენება კონდახის ცხრილის მნიშვნელობა CELLPADDING=10.


ბრინჯი. 4.8.ცხრილი მნიშვნელობებით CELLPADDING=10

CELLPADDING და CELLSPACING პარამეტრების მოქმედება ძალიან ჰგავს. ჩარჩოების გარეშე ცხრილისთვის, ამა თუ იმ პარამეტრის შეცვლა იგივე შედეგს გამოიღებს. ორივე პარამეტრი გადადის გარე შეყვანებზე ერთდროულად ჰორიზონტალურად და ვერტიკალურად. სამწუხაროა, რომ არსებობს ჰორიზონტალური და ვერტიკალური შესასვლელების ცალკე კონტროლი, როგორც ეს იყოფა, მაგალითად, გამოსახულების შესასვლელებისთვის (პარამეტრები HSPACE და VSPACE ტეგი ), არ არის გადაცემული.

სამივე პარამეტრი - BORDER, CELLPADDING და CELLSPACING მუშაობს ერთმანეთისგან დამოუკიდებლად, თუ რომელიმე მათგანი გამოტოვებულია, მაშინ ჩვეულებისამებრ მიიღეთ მათი მნიშვნელობა. თუმცა, თუ ყველა პარამეტრი გამოტოვებულია, მაშინ მონაცემებს შორის მინიმალური მანძილი არის დაახლოებით 6 პიქსელი (Netscape-ისთვის). ეს მნიშვნელობა არის ორი პიქსელის ჯამი CELLSPACING-ისთვის, ერთი პიქსელი CELLPADDING-ისთვის და ერთი პიქსელი შუაში არსებული კანის ჩარჩოსთვის. ყველაზე კომპაქტური ცხრილი შეიქმნება შემდეგი აღწერილობით:

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

WIDTH და HEIGHT პარამეტრები

ცხრილის ჩვენებისას მისი სიგანე და სიმაღლე ავტომატურად გამოითვლება ბრაუზერის მიერ და დამოკიდებულია მრავალ ფაქტორზე: მთელი დოკუმენტის აღწერილობაში მითითებული პარამეტრების მნიშვნელობაზე, ამ ცხრილზე, მისი სტრიქონების კიდეებსა და შუაში. შუა რიცხვების ნაცვლად, ისევე როგორც პარამეტრები, რომლებიც დაყენებულია დოკუმენტის განხილვისას, მათ შორის სხვა ბრაუზერები, მაგალითად, შრიფტის ტიპი და ზომა, ხედის ზომა და ა.შ. როდესაც განზომილებების ზომები გამოჩნდება, ცხრილი ავტომატურად რეგულირდება ამ ფაქტორების ბალანსზე, ამიტომ შეეცადეთ ცხრილი მაქსიმალურად ხელით წარმოაჩინოთ - მოათავსეთ ცხრილი ისე, რომ ის იმავე ხედში მოთავსდეს. დიდი დოკუმენტების განხილვის ძირითადი სქემა, როგორც წესი, მცირდება დოკუმენტის ვერტიკალურად ნაცვლად ხაზოვან გადახვევაზე და ტექსტის წაკითხვაზე, რომელიც იკვეთება სხვადასხვა ცხრილებით, სურათებით და ა.შ. არსებობს როგორც HTML დოკუმენტები, ასევე ძირითადი დოკუმენტები, რომლებიც შექმნილია ნებისმიერ ტექსტურ რედაქტორში. ტექსტის რედაქტორების უმეტესობა (მაგალითად, Microsoft word), და HTML ბრაუზერები ავტომატურად აფორმებენ ტექსტს (რაც შესაძლებელია), რომ სტრიქონები არ აღემატებოდეს ხედის პორტის სიგანეს. ეს გამორიცხავს დოკუმენტის ჰორიზონტალური გადახვევის საჭიროებას. ბრაუზერები ანალოგიურად მუშაობენ ცხრილებთან - თუ შესაძლებელია, დააფორმეთ ისინი ისე, რომ ცხრილის სიგანე არ აღემატებოდეს ხედის სიგანეს. თქვენ შეგიძლიათ შექმნათ განლაგება, სადაც ცხრილის სიგანე არის ყველაზე მნიშვნელოვანი, პირველი რიგის პარამეტრი, რომლის განლაგება პირდაპირ არის ორიენტირებული სიმაღლის წინ.

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

. ჩანაწერის ფორმაა: WIDTH=num და WIDTH=num%, სადაც num არის მთელი ცხრილის სიგანის რიცხვითი მნიშვნელობა პიქსელებში ან ფანჯრის ზომის მეასედებში. გთხოვთ გაითვალისწინოთ, რომ დასაშვებია 100%-ზე მეტი მნიშვნელობების დაყენება, თუ გსურთ იცოდეთ თქვენი შეცდომების შესახებ, მაგრამ ეს არ არის აუცილებელი. კონდახი:

.

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

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

ALIGN პარამეტრი

ეს ტეგის პარამეტრი

ეს ნიშნავს მაგიდის ფართობის ჰორიზონტალურ გაფართოებას ხედში. მისაღები მნიშვნელობებია LEFT (მარცხნივ გასწორება) და RIGHT (მარჯვნივ გასწორება). ცხრილები დალაგებულია მარცხენა კიდის მიხედვით. გთხოვთ გაითვალისწინოთ, რომ მისაღები მნიშვნელობები არ შეიცავს ვერიფიკაციის პარამეტრის ტიპურ მნიშვნელობას - CENTER. სხვა სიტყვებით რომ ვთქვათ, HTML მნიშვნელობა CENTER (ცენტრში) უნდა იყოს დასაშვებად დაყენებული ამ ველში. ეს შეესაბამება HTML სპეციფიკაციებს, მაგრამ პრაქტიკულია როგორც Netscape Navigator-ისთვის, ასევე Microsoft Internet Explorer-ისთვის მხოლოდ ორი მნიშვნელობის დანერგვა. მარჯვნივ არის ALIGN პარამეტრის არსებობა ტექსტში
ეს მიუთითებს მაგიდის გადაადგილების ადგილს და გაძლევთ საშუალებას, მოპირდაპირე მხრიდან ტექსტი მოახვიოთ მაგიდის გარშემო ისე, როგორც სურათების გარშემო. ორივე მხრიდან მაგიდის ირგვლივ შეფუთული ტექსტი არ არის გადატანილი ისე, როგორც მოსალოდნელია. შეფუთვების უფრო ზუსტი დამუშავებისთვის გამოიყენეთ ტეგი
CLEAR პარამეტრით ის იგივეა, რაც მას შეესაბამება . თუ ALIGN პარამეტრი გამოტოვებულია, მარჯვენა ან მარცხენა ცხრილი ყოველთვის ცარიელი იქნება მისი სიგანის მიუხედავად. თუ მაგიდას არ სჭირდება ტექსტით გარშემორტყმა, შეგიძლიათ მოაწყოთ იგი ხედის ცენტრში. რისთვისაც, მაგალითად, შეგიძლიათ მოათავსოთ მთელი ცხრილის აღწერა წყვილი ტეგების შუაში
і
.

მოდით შევხედოთ ცხრილს უბრალო ტექსტით, რომელიც ნაჩვენებია ნახ. 4.9.

ცხრილი შეფუთული ტექსტით


მოწიფული

პეტერბურგის მოსახლეობა

  • აბრამი
  • ალექსანდრე
  • ოლექსია
  • ალბერტ
  • ანატოლი
  • ანდრეი

  • არკადი
  • ბორის
  • ვადიმ
  • ვალენტინი
  • ვალერი
  • ვასილ

  • ვიქტორ
  • ვიტალი
  • ვლადიმირ
  • ვლადისლავი
  • ვიაჩესლავ

  • გენადი
  • გიორგი
  • ჰერმანი
  • გრიგოლი
  • დიმიტრო

  • ევგენ
  • იუხიმ
  • ივანე
  • იგორ
  • ილია
  • იოსიპი
  • კოსტიანტინი

  • ლომი
  • ლეონიდი
  • მიხაილო
  • მიკოლა
  • ოლეგ
  • პავლო
  • პეტრო

  • რომანი
  • სემიონი
  • სერგი
  • სტანისლავ
  • ედუარდ
  • იური
  • იაკოვი








  • დანიშნულ 43 არის ყველაზე ხშირად შერჩეული და მოიცავს შერჩევის 92%-ს.

    ბრინჯი. 4.9.მაგიდა ჩარჩოების გარეშე, ტექსტით, რომელიც ახვევს გარშემო

    ეს დოკუმენტი შედგება ცხრილისაგან საზღვრების გარეშე, გასწორების პარამეტრით ALIGN=LEFT, რომელიც საშუალებას აძლევს ცხრილის მიღმა ტექსტს მის ზემოთ მარჯვნივ გადავიდეს. ცხრილი შედგება მხოლოდ ერთი მწკრივისაგან, რომელიც შეიცავს ორ შუა რიგს. Kozhen შუა შურისძიების ნაწილი უნომრო სიაში

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

      არასწორი გადაწყვეტილება.

      მოდით შევხედოთ სხვა კონდახს მსგავსი მხარის შესაქმნელად, როგორც ნაჩვენებია ნახ. 4.10.

      მაგიდა მიმდებარე ტექსტის გარეშე

      ყველაზე პოპულარული ადამიანის სახელები

      პეტერბურგის ზრდასრული მოსახლეობა

    • აბრამი
    • ალექსანდრე
    • ოლექსია
    • ალბერტ
    • ანატოლი
    • ანდრეი

    • არკადი
    • ბორის
    • ვადიმ
    • ვალენტინი
    • ვალერი
    • ვასილ

    • ვიქტორ
    • ვიტალი
    • ვლადიმირ
    • ვლადისლავი
    • ვიაჩესლავ

    • გენადი
    • გიორგი
    • ჰერმანი
    • გრიგოლი
    • დიმიტრო

    • ევგენ
    • იუხიმ
    • ივანე
    • იგორ
    • ილია
    • იოსიპი
    • კოსტიანტინი

    • ლომი
    • ლეონიდი
    • მიხაილო
    • ნიკოლაი
    • ოლეგ
    • პავლო
    • პეტრო

    • რომანი
    • სემიონი
    • სერგი
    • სტანისლავ
    • ედუარდ
    • იური
    • იაკოვი

    • მონაცემები შეგროვდა წარმომადგენლობითი ნიმუშის ანალიზის საფუძველზე, რათა მიეწოდოს ინფორმაცია 18 ქვეყნიდან 5000 ადამიანის შესახებ, რომლებიც ცხოვრობენ პეტერბურგთან ახლოს.
      დანიშნულ 43 არის ყველაზე ხშირად შერჩეული და მოიცავს შერჩევის 92%-ს.
      სხვა სახელებით კანის კიბოს სიხშირე არ აღემატება 0,3%-ს.

      ბრინჯი. 4.10.ცხრილი ჩარჩოების გარეშე, რომელიც შეიცავს სამ სვეტს

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

      მონაცემების ფორმატირება ცხრილის შუაში

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

      ,
      ,


      , სათაურის კოდები - vid

      ადრე

      , სიმბოლოების ფორმატირების ტეგები -<В>, , , , , , , ტეგები გრაფიკული სურათების ჩასართავად , ჰიპერტექსტი პოზილანი<А>და ა.შ. მნიშვნელოვანია აღინიშნოს, რომ შუაში მითითებული ტეგების ფართობი ესაზღვრება შუაზე, საბოლოო ტეგის არსებობის მიუხედავად. მაგალითად, ველის შუაში მითითებულია ტექსტის ფერი - , შემდეგ მიმართეთ საბოლოო კოდსან ცხრილის რამდენიმე შუასა და მწკრივში გავრცელებით, შემდეგი შუაშის ტექსტი ნაჩვენები იქნება ტექსტის ფერში.

      გადაცემის ცხრილის შუაში მონაცემების დასაფორმებლად გამოიყენეთ შემდეგი პარამეტრები.

      გასწორების პარამეტრები შუაზე ნაცვლად - ALIGN და VALIGN. შეიძლება კოდებში გაჭედოთ , і . ჰორიზონტალური გასწორების პარამეტრი ALIGN შეიძლება დაყენდეს LEFT, RIGHT და CENTER (იგივე LEFT რომ ცენტრისთვის ). ვერტიკალური გასწორების პარამეტრი VALIGN შეიძლება დაყენდეს TOP (ზედა კიდის გასწვრივ), BOTTOM (ქვედა კიდის გასწვრივ), MIDDLE (შუაში), BASELINE (ძირის ხაზის გასწვრივ). ემზადება - MIDDLE. საბაზისო ხაზის დადასტურება უზრუნველყოფს, რომ მიმდებარე მწკრივის ტექსტი დაკავშირებულია ყველა შუა ხაზთან ერთ ხაზამდე. კოდის ტოლი გადამოწმების პარამეტრების დაყენება ნიშნავს გადამოწმებას მოცემული მწკრივის შუაგულებისთვის, ამ შემთხვევაში მწკრივის შუაგულის მიმდებარე კანს შეიძლება ჰქონდეს საკუთარი პარამეტრების მინიჭება, რომლებიც შემდეგ ხელახლა ენიჭებათ მითითებულ პარამეტრებს .

      მოდით შევხედოთ ცხრილს, რომელშიც პირველი სვეტი არის გასწორებული მარჯვნივ, მეორე სვეტი არის ცენტრში, ხოლო მესამე არის მარცხნივ (მნიშვნელობები მარცხნივ):

      ცხრილის ელემენტების შემოწმება

      შუა 1 შუა 2 შუა 3
      კომირკა 4 შუა 5 შუა 6

      ამ აპლიკაციის ბრაუზერის ხედი ნაჩვენებია ნახ. 4.11.


      ბრინჯი. 4.11.მონაცემთა გადამოწმება ცხრილის შუაში

      NOWRAP პარამეტრი იძლევა ტექსტის ავტომატურ დაყოფას მწკრივებად. შესაძლოა კოდებზე გაჭედოთ , і . გაუმართლებლად სტაგნაციის პარამეტრის არარსებობის გამო, ჯერ კიდევ შესაძლებელია დაჩქარდეს ცხრილის ზომის დინამიურად შეცვლისა და მათი დაბნეულობის აღმოფხვრა. სტრიქონების უმეტესობაში საკმარისია შემდეგი სტრიქონების NOWRAP-ის გამოყენება, რაც ეფექტურად აფერხებს მარცხენა მწკრივზე გადასვლას. აქედან გადაადგილება მუშაობს მხოლოდ გამყოფების უკან სიტყვებს შორის (სივრცეები) და რამდენიმე ჩამოსაშლელ ღილაკებში, რათა დაიცვათ ტექსტი ახლომდებარე ადგილებში გატეხვისგან, შეცვალეთ სივრცის სიმბოლო შეუწყვეტელი სივრცის კოდით (NonBreaking Space). იმის გამო, რომ კონდახს შეუძლია ზიანი მიაყენოს, არ არის რეკომენდებული გახეხვა - ციფრულ მნიშვნელობებსა და მოცემული მნიშვნელობის ერთეულებს შორის; მეტსახელებსა და ინიციალებს შორის. ასე რომ, ტექსტი არის 650 კმ. ან ელცინი ბ.მ. რეკომენდირებულია ჩაწერა თქვენი ხედით 650 კმ და ელცინი ბ.მ.

      WIDTH და HEIGHT პარამეტრები შეიძლება დარჩეს კოდებში і . მისი სინტაქსი მსგავსია ტეგის ამ პარამეტრების სინტაქსისა

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

      დასაკეცი მაგიდები ხასიათდება რამდენიმე პატარა ცენტრის ჰორიზონტალურად ან ვერტიკალურად გაერთიანების აუცილებლობით. ეს შესაძლებლობა რეალიზებულია დამატებითი პარამეტრების COLSPAN (COLiimn SPANning) და ROWSPAN (ROW SPANning) მეშვეობით, რომლებიც მითითებულია კოდებში.

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

      ნახ. 4.17 წაკითხვა არის მოცემული კოდის განხორციელების შედეგი, ასევე ასეთი ცხრილის ჩვენების ვარიანტი სათაურში RULES=GROUPS ჩანაწერის გამოყენებით.

      ან კიდევ . ჩაწერის ფორმა: COLSPAN = num, სადაც num არის რიცხვითი მნიშვნელობა, რომელიც ნიშნავს რამდენი ბილიკი უნდა გააფართოვოს ნაკადის ხაზი ჰორიზონტალურად. ROWSPAN პარამეტრის განმარტება მსგავსია, მხოლოდ აქ არის მითითებული მწკრივების რაოდენობა, რომლებიც შეიძლება გამოყენებულ იქნას ვერტიკალური ნაკადისთვის. ამ პარამეტრების გარეცხვის შემდეგ, მნიშვნელობები დაყენებულია იმავე ერთეულებზე. დასაშვებია ორივე პარამეტრის მნიშვნელობების ერთდროულად დაყენება ერთი გადახდისთვის. ამ პარამეტრების მნიშვნელობების სწორად დაყენებამ შეიძლება არ გამოიწვიოს მარტივი პარამეტრები, მით უმეტეს, რომ HTML რედაქტორების უმეტესობა საშუალებას გაძლევთ ვიზუალურად შექმნათ უმარტივესი ცხრილებიც კი HTML კოდების უშუალო გენერირებით.

      ნახ. 4.12 ცხრილის ჩვენება, შემდეგი HTML კოდის შემდეგ:

      COLSPAN და ROWSPAN პარამეტრების ვარიაცია

      შუა, რომელიც ორ რიგს მომენატრა შუა, რომელსაც ორასი ადამიანი მოუნდება
      შუა 3 შუა 4
      შუა 5 შუა 6 შუა 7


      ბრინჯი. 4.12.ცხრილი შუაგულებით, რომლებიც განაწილებულია რიგ მწკრივებზე ან მწკრივებზე

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

      მოდით შევხედოთ HTML კოდს (რომლის სურათი ნაჩვენებია ნახ. 4.13-ზე), რომლისთვისაც კოდის სიგრძეები არასწორად არის ჩამოყალიბებული.

      გრძელი შუაგულების არასწორი შერჩევა

      შუა 1 შუა 2

      შუა 3
      (გაფართოვდა
      ჰა სამი
      რიგები)

      კომირკა 4შუა 5
      შუა 6 შუა 7 (გაფართოვდა ორასი ქულით)

      ბრინჯი. 4.13.გრძელი შუა ხაზების არასწორი მინიჭების შედეგი (ტექსტის გადაფარვა)

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

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


      ბრინჯი. 4.15.ცხრილის ცარიელი შუა ნაწილი განსხვავებულად არის ნაჩვენები სხვადასხვა ბრაუზერში

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

      მონაცემთა გადამოწმება ცხრილის სვეტებში

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

      . თუმცა, ხშირად საჭიროა ერთი სვეტის ყველა ელემენტის ერთნაირი გადამოწმების უზრუნველყოფა, ვინაიდან სვეტის ელემენტების უმეტესობა შეიცავს ერთსა და იმავე მონაცემებს. HTML-ის ადრეულ ვერსიებში ამ მიზნით გამოიყენებოდა COLSPEC (COLumn SPECification) პარამეტრი, რომელიც მითითებული იყო სათაურში.
      і . ეს შესაძლებლობა არ არის დაფარული HTML სპეციფიკაციით, მაგრამ მხარდაჭერილია როგორც Netscape-ის, ასევე Microsoft Internet Explorer-ის მიერ. შესვლის ფორმა იგივეა, რაც ტეგისთვის , და თავად: BGCOLOR=მნიშვნელობა, სადაც მნიშვნელობა მითითებულია ფერის ნაცვლად RGB ფორმატში ან მისი სახელი.

      კონდახი:

      ან კიდევ .

      მაგიდის დანართები

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

      ავიღოთ ცხრილი, რომელიც გვიჩვენებს ერთი დონის წვლილს.

      ლენინგრადის რეგიონის ადგილები

      ლენინგრადის რეგიონის ადგილები

      H - ქალაქის მოსახლეობა (tis.zhit., 1992)

      P - ხედი პეტერბურგიდან (კმ)

      პეტერბურგის დაქვემდებარებული ადგილები
      მისტო
      ზელენოგირსკი 13.6

      50

      კოლპინო144.6

      26

      კრონშტადტი 45.2

      48

      ლომონოსივი 42.0

      40

      პოვლივსკი 25.4

      30

      პეტროდვორეც 83.8

      29

      პუშკინი 95.1

      24

      სესტრორეცკი 34.9

      35

      ყველა ადგილი წესრიგშია
      ადმინისტრაცია
      პეტერბურგი, მოსალოდნელია
      სწორი პური
      ტელეფონის ნომრები.

      რეგიონალური შეკვეთის ადგილები
      მისტო
      ბოქსიტოგორსკი 21.6

      ALIGN = RIGHT > 245

      ბოლხოვი 50.3

      ALIGN = RIGHT > 122

      ვსევოლოჟსკი 32.9

      24

      ვიბორგი 80.9 130
      ვისოცკი 1.0

      ALIGN = RIGHT > 159

      გაჩინა 80.9 46
      ივანგოროდი 11.9

      ALIGN = RIGHT > 147

      კამიანოგირსკი 5.9 157
      კინგისეპი 51.5

      ALIGN = RIGHT > 138

      კირიში 53.8

      ALIGN = RIGHT > 115

      კიროვსკი 23.8

      55

      ლოდეინის ველი 27.3

      ALIGN = RIGHT > 244

      მდელოები 41.8139

      (მაგიდის გაგრძელება)
      მისტო
      ლიუბანი 4.7

      85

      ნოვა ლადოგა 11.2

      ALIGN = RIGHT > 141

      ვტიშნე 22. 9

      ALIGN=RIGHT>40

      პიკალევო 25.1

      ALIGN = RIGHT > 246

      პოდპოროჟჟი 23.1285
      პრიმორსკი 6.7137
      პრიოზერსკი 20.5

      ALIGN = RIGHT > 145

      სვიტოგორსკი 15.8

      ALIGN = RIGHT > 201

      სლანცი 42.6

      ALIGN = RIGHT > 192

      სოსნოვი ბირ 57.6

      81

      ტიხვინი 72.0

      ALIGN = RIGHT > 200

      ტოსნო 33.8

      53

      ს ლისელბურგი 12.5

      64

      ბრინჯი. 4.14.ჩანართების მაგიდის კონდახი

      კონდახის გამოსახულების შედეგი ნაჩვენებია ნახ. 4.14.

      ერთი შეხედვით ჩანს, რომ აპლიკაციას არ აქვს ცხრილი. სინამდვილეში, მთელი დოკუმენტი არის ცხრილი, რომელსაც არ აქვს ჩარჩოები და შედგება სათაურისა და მხოლოდ ერთი მწკრივისგან, რომელიც შეიცავს ხუთ შუას. ასეთი ცხრილის ორგანიზება ემსახურება როგორც ერთ მეთოდს - მონაცემების განაწილებას გვერდზე. პირველი შუაში გაფართოვებულია კიდევ ერთი ცხრილი, რომელსაც აქვს საკუთარი სათაური და შედგება სამი სვეტისაგან, რის შემდეგაც ჩნდება ტექსტი, შუაზე გასწორებული. მესამე და მეხუთე შეკვეთები ასევე განთავსებულია მაგიდის გარშემო. მეორე და მეოთხე შუაები ცარიელია, ისინი არ შეიცავს მონაცემებს და შეიცავს ერთ WIDTH პარამეტრს, თავდაპირველ სიგანეს. მათი მიზანია დაამყარონ კავშირი პირველ და მესამე, ასევე მესამე და მეხუთე შუას შორის, რომლებშიც ცხრილები გაფართოებულია. ეს არის ერთ-ერთი შესაძლო ვარიანტი ასეთი წვდომის უზრუნველსაყოფად. კიდევ ერთი ვარიანტია CELLSPACING პარამეტრის შეცვლა, რაც ნიშნავს მანძილს ცენტრებს შორის, ეს პარამეტრი აყენებს შეყვანას ერთდროულად ჰორიზონტალურადაც და ვერტიკალურადაც, რაც ამ მომენტში არ არის საჭირო. გარდა ამისა, ცარიელი განყოფილება მოცემული სიგანით, როდესაც ინტერესის არეალი ჩანს, მალე გამოჩნდება ჩანაცვლებული სივრცე CELLSPACING პარამეტრით (ისევე როგორც CELLPADDING). ამ შემთხვევაში, შეეცადეთ შეცვალოთ ბრაუზერში სანახავი არეალის სიგანე, ან, რაც იგივე შედეგებს გამოიღებს, გაზარდეთ შრიფტის ზომა, რომელშიც ნაჩვენებია ტექსტი. შეგიძლიათ ცხრილებს შორის გადახვიდეთ ნულამდე, რაც გაძლევთ შესაძლებლობას წაიკითხოთ ყველა ინფორმაცია ერთდროულად, მაგრამ შემდგომი ცვლილება არ გამოიწვევს ცხრილის წაშლას, არამედ საშუალებას გაძლევთ გადახვიდეთ ჰორიზონტალურად. მსგავსი სქემის გამოყენებით, შეგიძლიათ მოაწყოთ ინფორმაციის განთავსება, რომელიც იქმნება ცხრილის სახით, და სურათები, ტექსტის ფრაგმენტები და ა.შ.

      თითოეული მაგიდის მახასიათებლები

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

      ცარიელი მედიის ჩვენება ცხრილებში

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

      і
      და მიუთითებს ცხრილის კანის სვეტის სიგანეზე. მაგალითად, ბრძანება colspec="L40 R50 C80" ცხრილის სამი სვეტისთვის გულისხმობდა წიგნების მონაცემების გასწორებას: პირველი სვეტისთვის - LEFT, მეორისთვის - RIGHT და მესამესთვის - CENTER, ასევე. კანის სვეტის სიგანე. როგორც HTML ენა ვითარდება, ეს პარამეტრი არჩეულია და ამ დროისთვის არ შეიყვანეთ ენის სპეციფიკაცია და არ არის მხარდაჭერილი ბრაუზერების უმეტესობის მიერ. შედეგად, Netscape Navigator-ში ასეთი ამოცანის შესასრულებლად არ არსებობს სპეციალური ფუნქციები და ერთადერთი ვარიანტია შიგთავსის სიახლოვეს ჩამორთმევა ან კანის ცენტრში მსგავსი მნიშვნელობების დაყენება, სადაც ეს არ არის საჭირო.

      Microsoft Internet Explorer-მა გადასცა სპეციალური ტეგები -

      і . ეს ტეგები არის დამნაშავე აღწერისთანავე
      ტეგის პირველ გამოჩენამდე .

      ტეგის პარამეტრები

      і შეიძლება იყოს SPAN, რაც ნიშნავს მიმდებარე სვეტების რაოდენობას, რომელიც აფართოებს პარამეტრების მნიშვნელობას და ALIGN, რაც ნიშნავს მონაცემთა ჰორიზონტალურ გასწორებას ხაზის სვეტის (ან სვეტების) ყველა ნაწილში. ALIGN პარამეტრის სწორი მნიშვნელობებია LEFT, RIGHT და CENTER. SPAN პარამეტრისთვის, მნიშვნელობები ეფუძნება ძველ ერთეულებს.

      მონიშნეთ

      გარდა ამისა, ის საშუალებას გაძლევთ დააყენოთ VALIGN პარამეტრი, რაც ნიშნავს მონაცემების ვერტიკალურ გასწორებას ყუთებში. VALIGN პარამეტრის სწორი მნიშვნელობებია MIDDLE, TOP და BOTTOM.

      შესაბამისობა ტეგებს შორის

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

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

      (მონაცემები ცხრილისთვის)

      გამოსახულების კოდის შედეგი ნაჩვენებია ნახ. 4.16.


      ბრინჯი. 4.16.ცხრილი მონაცემთა გადამოწმების სხვადასხვა პარამეტრით შუა რიცხვების ჯგუფებისთვის

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

      (მონაცემები ცხრილისთვის)

      ვისი განაცხადი ტეგის შემდეგ

      , რაც აჩვენებს ჯგუფის მორჩილების გრძნობას.

      პორადა

      ტეგების სტაგნაციის სფეროს ფრაგმენტები

      і ურთიერთდაკავშირებულია ერთი Microsoft Internet Explorer ბრაუზერით, გთხოვთ გამოიყენოთ ისინი სიფრთხილით. ამ ტეგების გამოყენების მნიშვნელობა აშკარაა, მაგრამ პრაქტიკაში ცხრილების უმეტესობა დაექვემდებარება ALIGN ვალიდაციის პარამეტრს თითოეული ცხრილის შუაში, სადაც ეს აუცილებელია, რაც ნიშნავს მნიშვნელოვნად დიდ დატვირთვას ცხრილების გამომავალ კოდზე და ეს იქნება უზრუნველყოს მისი ნახვის შესაძლებლობა ნებისმიერ ბრაუზერში.


      ბრინჯი. 4.17.ცხრილი დაჯგუფებებით

      დააყენეთ მაგიდის ჩარჩოების ფერი

      Microsoft Internet Explorer-ში არსებული რიგი სხვა პარამეტრები საშუალებას გაძლევთ აირჩიოთ მაგიდის ჩარჩოების ფერი - BORDERCOLOR, BORDERCOLORLIGHT და BORDERCOLORDARK. ამ პარამეტრების დაყენება შესაძლებელია ტეგებში

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

      შენიშვნა

      Netscape ბრაუზერის ვერსია 4.x ასევე მხარს უჭერს BORDERCOLOR პარამეტრს.

      მაგიდის ფონის დაყენება

      Microsoft Internet Explorer ბრაუზერი (და Netscape ბრაუზერის ვერსია 4.x) გაძლევთ საშუალებას აირჩიოთ BACKGROUND პარამეტრი, საწყისი ფონის ფენა მთელი HTML დოკუმენტის ნაწილების ცხრილისთვის. ეს პარამეტრი შეიძლება მითითებული იყოს ტეგებში

      , і
      , , ვ

      Microsoft Internet Explorer ბრაუზერი გაძლევთ საშუალებას აირჩიოთ ახალი ტეგები სტრუქტურირებული ცხრილებისთვის და მოქნილი კონტროლი ჩარჩოებისა და ხაზების ბადეებისთვის.

      ტეგები

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

      ტეგები მაგიდის სტრუქტურა

      і
      .

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

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

      როდესაც ახალი ტეგები დაემატება, შესაძლებელი ხდება ცხრილის საზღვრებისა და ბადის ხაზების შეცვლა.

      მაგიდის გარშემო ჩარჩოს ეტიკეტების კონტროლი კონტროლდება FRAME ტეგის პარამეტრით

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

      FRAME პარამეტრს შეუძლია მიიღოს შემდეგი მნიშვნელობები:

      • BOX ან BORDER - ჩარჩო შეღებილია ოთხივე მხრიდან
      • ზემოთ - ტილკი ზემოდან
      • ᲥᲕᲔᲕᲘᲗ - მხოლოდ ქვედა მხრიდან
      • HSIDES - ქვედა და ზედა მხარეები შეღებილია
      • VSIDES - მარცხენა და მარჯვენა მხარეები შეღებილია
      • LHS - ტილკი მარცხენა მხარეს
      • რ.ჰ.ს. - მხოლოდ მარჯვენა მხარეს
      • ბათილად - მაგიდა გარე ჩარჩოების გარეშე

      RULES პარამეტრი აჩვენებს ცხრილის მონიშნულ შიდა ბადის ხაზებს და შეუძლია მიიღოს შემდეგი მნიშვნელობები:

      • ყველა - ყველა შიდა ხაზი შეღებილია
      • ჯგუფები - შედგენილია ხაზების გარეშე, რომლებიც გამოყოფენ ჯგუფებს
      • ROWS - შედგენილია ხაზები, რომლებიც გამოყოფენ რიგებს
      • COLS - შედგენილია ხაზები, რომლებიც გამოყოფენ სვეტებს
      • არცერთი - შიდა ხაზები არ არის მოხატული

      კონდახი:

      .

      შენიშვნა

      ცხრილისა და ჩარჩოების ხაზის ბადე მონიშნული იქნება მხოლოდ BORDER ტეგის პარამეტრის არსებობის გამო.

      . ნებისმიერი მოცემული პარამეტრისთვის ან ნულოვანი მნიშვნელობისთვის, ქსელის ხაზები და ჩარჩოები იგივე იქნება FRAME და RULES პარამეტრების ნებისმიერი მნიშვნელობისთვის.

      მოდით შევხედოთ HTML კოდს, რომელიც ქმნის ცხრილს შესაძლებლობების ვიკი აღწერილობით:

      სათაურის და ჩანთის რიგის ხედი

      ცხვრის ტყავის ქარავნის კონდახი ხაზებით
      მაგიდის ბადეები

      განყოფილების სათაური 1 თავი 2 სათაური მე-3 თავის სათაური
      დანიდანიდანი
      დანიდანიდანი
      დანიდანიდანი
      დანიდანიდანი
      დანიდანიდანი
      დანიდანიდანი
      ᲩანთაᲩანთაᲩანთა


      ბრინჯი. 4.18.გნუჩკა მაგიდის ხაზოვანი ბადის მარკირებას Microsoft Internet Explorer ბრაუზერით

      ამ აპლიკაციაში ბრაუზერის ჩვენება ნაჩვენებია ნახ. სურათი 4.18 გვიჩვენებს ცხრილის გვერდით ბადის ხაზებისა და ჩარჩოების მართვის ერთ-ერთ შესაძლო ვარიანტს. მაგიდის გვერდით არის 5 პიქსელის სისქის ჩარჩო (BORDER=S) ზედა და ქვედა გვერდებზე (FRAME=HSIDES). ცხრილის შუაში არის ბადის ხაზები, რომლებიც გამოყოფენ მონაცემთა ჯგუფებს (RULES=GROUPS). მონაცემთა ჯგუფები, პირველ რიგში, სამი ტეგის არსებობით არის დანიშნული , გამხდარი ხმები ცხრილის ზედა ნაწილშიჯგუფში. სხვაგვარად, ტეგები , і<тгоот>ასევე ცხრილის მონაცემები დაყავით ჯგუფებად, რაც გულისხმობს შიდა ჰორიზონტალური ხაზების მონიშვნას.

      ცხრილის სვეტების რაოდენობის დაზუსტება

      Microsoft Internet Explorer (ისევე, როგორც Netscape ბრაუზერის ვერსია 4.x) გაძლევთ საშუალებას მიუთითოთ

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

      ვერტიკალური გასწორების ცხრილი

      ტეგის დარჩენილი პარამეტრი

      , რომელიც უფრო ძლიერია ვიდრე Microsoft Internet Explorer, არის VALIGN, რაც ნიშნავს, რომ ცხრილი ვერტიკალურად არის გასწორებული ტექსტთან. ეს ქმედება სურათის იგივე პარამეტრის მსგავსია.

      შენიშვნა

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

      • ტეგისთვის
      ALIGN პარამეტრს შეიძლება ჰქონდეს მნიშვნელობები LEFT ან RIGHT, რაც ნიშნავს ცხრილის გაფართოებას, დაჭერით ცხრილის მარცხენა ან მარჯვენა კიდეზე;
    • ტეგისთვის
    • ,
      ALIGN პარამეტრი იღებს TOP ან BOTTOM მნიშვნელობებს, რაც ნიშნავს, რომ ცხრილის სათაური გადაადგილებულია ცხრილის ზემოთ და ქვემოთ;
    • ტეგებისთვის
    • і ALIGN პარამეტრი იღებს მნიშვნელობებს LEFT, RIGHT ან CENTER და ნიშნავს ცხრილის ჰორიზონტალურ სვეტთან (ან ცენტრთან) გასწორებას.

      ცხრილის შეტანის ალტერნატივა

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

      ცხრილის გასაგებად სხვა გზებიც არსებობს:

      • Vikoristannya წინასწარ ფორმატირებული ტექსტი. ეს მეთოდი ტრადიციულად გამოიყენება ადრინდელი ვერსიები mov HTML, თუ ცხრილი ჯერ არ არის შექმნილი. ამ კონცეფციამ არ დაკარგა აქტუალობა დღემდე; სანამ ასეთი ტექსტები სწორად იქნება ნაჩვენები ნებისმიერი ბრაუზერის მიერ, მათ შორის წმინდა ტექსტური.
      • Vikoristannya სურათი ცხრილის საჩვენებლად. ცხრილის შექმნა მაინც შეიძლება ტექსტის რედაქტორიან გამოსახულება ნაჩვენებია ვებ ბრაუზერის მიერ და შემდეგ შეინახება სურათის სახით ერთ-ერთ გრაფიკულ ფორმატში. Არ არის მოკლე ვარიანტი, რადგან ამ შემთხვევაში ცხრილის ხედის დინამიურად მორგების მთელი მოქნილობა იკარგება. გარდა ამისა, საჭიროა დაზოგვა დამატებითი ფაილისურათებით, რომელთა ზომა ჩვეულებრივ მნიშვნელოვნად აღემატება ტექსტის ზომას, რომელიც აღწერს HTML ცხრილს. სტაგნაციის შესაძლო არეა არის მკაცრად მცირე ზომის ცხრილები, რომლებისთვისაც მათი ჩვენების სიცარიელე მიუღებელია რაიმე გარე ფაქტორების გამო (შრიფტები, ბრაუზერის მუშაობის რეჟიმები და ა.შ.).
      • სიების სია იცვლება ცხრილით. უმარტივესი პრობლემებისთვის, ცხრილის ორგანიზების ნაცვლად, შეგიძლიათ გამოიყენოთ HTML-ში ნაპოვნი სიების ერთ-ერთი ტიპი.

      მოსამზადებელი მაგიდა

      HTML ცხრილის მოსამზადებლად შეგიძლიათ გამოიყენოთ სხვადასხვა რედაქტორები, რომელთა უმეტესობას შეუძლია შექმნას ვიზუალური ცხრილი. მოდით განვიხილოთ ცხრილის მომზადება HotDog Professional რედაქტორთან ერთად. ცხრილის შესაქმნელად, უბრალოდ აირჩიეთ Tables პუნქტი Insert მენიუდან, რის შემდეგაც ნახავთ დიალოგურ ფანჯარას, რომელიც ნაჩვენებია ნახ. 4.19. ცხრილის შექმნა გამოჩნდება ფანჯრის შევსებულ ველებში. მას შემდეგ რაც განსაზღვრავთ ცხრილის რიგებისა და სვეტების რაოდენობას, შეგიძლიათ გააგრძელოთ ცხრილის შემდეგი სტრიქონების სრულად შევსება, რომლებიც გამოჩნდება ამ დიალოგურ ფანჯარაში. დიალოგურ ფანჯარას აქვს Preview ღილაკი, რომელიც დაჭერის შემთხვევაში საშუალებას გაძლევთ ნახოთ დაინსტალირებული ბრაუზერის გამოყენებით მომზადებული ცხრილი (ნახ. 4.20).


      ბრინჯი. 4.19.დიალოგური ფანჯარა ცხრილის შესაქმნელად


      ბრინჯი. 4.20.ცხრილი ნაჩვენებია დამატებით ბრაუზერში

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

      (კოდის ნაწილი გამოტოვებულია)

      3 მაგიდის თავი
      Stovpets 1 Stovpets 2 Stovpets 3 Stovpets 4
      1 2 3 4

      ანალოგიურად, ეს პრობლემა ჩნდება, როდესაც Netscape Composer კომპონენტი გამოიყენება Netscape Communicator პროგრამების მიერ. ნახ. ნახაზი 4.21 გვიჩვენებს დიალოგურ ფანჯარას, სადაც უნდა შეავსოთ საჭირო ველები. შესავლისთვის დამატებითი პარამეტრებიტეგი

      დამატებითი HTML ღილაკი გადატანილია. დიალოგური ფანჯრის ველების შევსების შემდეგ დააჭირეთ ღილაკს Apply და მოგეცემათ შესაძლებლობა შეავსოთ ცხრილის შუა ნაწილი (ნახ. 4.22).

      ბრინჯი. 4.21.დიალოგური ფანჯარა ცხრილის პარამეტრების დასაყენებლად Netscape Composer-ის გამოყენებით


      ბრინჯი. 4.22.ცარიელ მაგიდაზე შეყვანის კურსორის გასასვლელი პოზიცია

      ზავდანნია

      შექმენით ცხრილი და მიუთითეთ მისი პარამეტრები (ველები და შუა ნაწილებს შორის) სტილების საშუალებით.

      გადაწყვეტილება

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

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

      მაგალითი 1. ცხრილის შექმნა

      HTML5 IE Cr Op Sa Fx

      მაგიდის ტეგი

      შუა 1 შუა 2
      შუა 3 შუა 4

      შუაგულების მორევის რიგი და მისი გარეგნობა ნაჩვენებია ნახ. 1.

      ბრინჯი. 1. რამდენიმე შუაშიანი ცხრილის შექმნის შედეგი

      სასაზღვრო ტეგის ატრიბუტი

      დასაშვებია მხოლოდ ცარიელი მნიშვნელობების დამატება (
      ) ან უდრის 1. ყველა სხვა მნიშვნელობა არ გაივლის ვალიდაციას.

      ვიკორისტების შუაში არსებული ველების გასაკონტროლებლად, padding-ის სტილის ძალა გამოიყენება td სელექტორზე. შუაში იცვლება საზღვრების დაშორების ძალა (მაგალითი 2), რომელიც გამოიყენება ცხრილის ამომრჩეველზე, IE ბრაუზერს ესმის მხოლოდ 8.0 ვერსია.

      მაგალითი 2. მინდვრები შუაში

      HTML5 CSS 2.1 IE Cr Op Sa Fx

      მაგიდის ტეგი

      სათაური 1სათაური 2
      შუა 3შუა 4

      ცხრილი ველებითა და შუა ხაზებით ნაჩვენებია ნახ. 2. მსგავსი შედეგის მიღწევა შესაძლებელია შუაზე თეთრი ფერის ჩარჩოს მიღმა.

      ბრინჯი. 2. ველები მაგიდის შუაში

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


      ტეგები, რომლებიც უნდა მოძებნოთ html-ში ცხრილის შესაქმნელად

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

      მარტივი ცხრილის კოდის მაგალითი



      <a href="https://3ddroid.ru/ka/gadgets/tablica-cvetov-html-lavandovyi-cvet-v-stilyah-mozhno-zadavat/">HTML ცხრილი</a>





      მაგიდის სახელი

      სტობიტები 1

      სტობიტები 2

      ტექსტი უპირველეს ყოვლისა

      ტექსტი მეორეს შუაში



      ბრაუზერი გამოჩნდება

      მინიჭებული ცხრილი html-ში

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

      html ცხრილის სიმძლავრე და პარამეტრები: შეწევა, სიგანე, ფონის ფერი, საზღვარი (ჩარჩო)

      მაგიდის ტეგიეს არის ატრიბუტები:

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

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



      HTML ცხრილი







      შედეგად, ბრაუზერში გამოჩნდება შეურაცხმყოფელი ტიპის ცხრილი

      ჩარჩო- ატრიბუტი, რომელიც ნიშნავს ჩარჩოს მაგიდის გარშემო. ეს არის მნიშვნელობები:

      ბათილად - ჩარჩოების გარეშე,
      ზემოთ - მხოლოდ ზედა ჩარჩო,
      ქვემოთ - მხოლოდ ქვედა ჩარჩო,
      hsides - მხოლოდ ზედა და ქვედა ჩარჩოები,
      vsides - მხოლოდ მარცხენა და მარჯვენა ჩარჩოები,
      lhs - მხოლოდ მარცხენა ჩარჩო,
      rhs - მხოლოდ სწორი ჩარჩო,
      ყუთი - ჩარჩოს რამდენიმე ნაწილი.

      წესები- ატრიბუტი, რომელიც მიუთითებს საზღვრებს მაგიდის შუაში, შუაგულებს შორის. ეს არის მნიშვნელობები:

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

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



      HTML ცხრილი


      სტობიტები 1

      სტობიტები 2









      შედეგი

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

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



      HTML ცხრილი


      სტობიტები 1

      სტობიტები 2

      ტექსტი პირველ რიგში პირველი ადგილის შესახებ

      ტექსტი სხვა შუა სხვა stovptsya







      ბრაუზერი აჩვენებს მსგავს ცენტრალურ ცხრილს

      tr და td რიგები HTML ცხრილებში

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





      ტეგებისთვის tr და td ახლოვდება

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

      მოდით შევხედოთ კოდს, ნაცვლად შუა (td), გასწორებული სხვადასხვა კიდეების გასწვრივ: პირველი მარცხნივ, მეორე მარჯვნივ:



      HTML ცხრილი


      სტობიტები 1

      სტობიტები 2

      ტექსტი პირველ რიგში პირველი ადგილის შესახებ

      ტექსტი სხვა შუა სხვა stovptsya

      სტობიტები 1

      სტობიტები 2







      შედეგი

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

      გმადლობთ პატივისცემისთვის! იმედი მაქვს, მასალა ყავისფერია!


      სტობიტები 1

      სტობიტები 2

      ტექსტი პირველ რიგში პირველი ადგილის შესახებ

      ტექსტი სხვა შუა სხვა stovptsya