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

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

როგორ მუშაობს ჩარჩოები ან ჩარჩოები HTML-ში?

ჩარჩოები შედგება ორი ელემენტისგან:

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

instagram story viewer

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

• მიჰყევით: iFrame მაგალითები

როგორ შევქმნათ ჩარჩოები HTML-ში

ჩარჩოებით HTML დოკუმენტის შესაქმნელად, მიჰყევით ორ ძალიან მარტივ ნაბიჯს:

1. შექმენით HTML დოკუმენტი, რომელიც განსაზღვრავს ჩარჩოების სტრუქტურას ელემენტის გამოყენებით. Მაგალითად:

ფაილი 1: frameset.html

2. შექმენით ერთი ან მეტი HTML დოკუმენტი, რომელიც ჩაიტვირთება ჩარჩოებში.

ფაილი 2: frame1.html

ეს არის ჩარჩო 1

ფაილი 3: frame2.html

ეს არის ჩარჩო 2

ჩარჩოს ატრიბუტები HTML-ში

ზოგიერთი ყველაზე მნიშვნელოვანი ელემენტის ატრიბუტი არიან:

• გადახვევა: ეს ატრიბუტი გამოიყენება ჩარჩოში გადახვევის ზოლების გარეგნობის გასაკონტროლებლად. მას შეიძლება ჰქონდეს მნიშვნელობები "auto", "yes" ან "no".

• noresize: ეს ატრიბუტი გამოიყენება მომხმარებლის მიერ ჩარჩოს ზომის შეცვლის თავიდან ასაცილებლად.

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

• src: ეს ატრიბუტი გამოიყენება ჩარჩოში ჩასატვირთი HTML დოკუმენტის URL-ის დასაზუსტებლად.

• ჩარჩოს საზღვარი: ეს ატრიბუტი განსაზღვრავს, უნდა ჰქონდეს თუ არა ჩარჩოებს საზღვრები. შესაძლო მნიშვნელობებია "1" (საზღვრების საჩვენებლად) ან "0" (საზღვრების საჩვენებლად). Მაგალითად, .

• საზღვარი: ეს ატრიბუტი განსაზღვრავს ჩარჩოებს შორის საზღვრის სიგანეს პიქსელებში. Მაგალითად, შექმნის ჩარჩოებს შორის 5 პიქსელის საზღვარს.

• ჩარჩოს ინტერვალი: ეს ატრიბუტი მსგავსია საზღვარი. ის ასევე განსაზღვრავს სივრცეს ჩარჩოებს შორის პიქსელებში. Მაგალითად, დააყენებს 10 პიქსელის უფსკრული კადრებს შორის.

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

გამოყენების მაგალითი:

როგორ დავაკავშიროთ კონკრეტული ჩარჩო

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

მენიუში.html
Გვერდი 1
გვერდი 2

ამ შემთხვევაში მენიუს ჩარჩოში „გვერდი 1“ ან „გვერდი 2“ ბმულებზე დაწკაპუნებით, შესაბამისი გვერდი ჩაიტვირთება „შინაარსის“ ჩარჩოში.

როგორ გავტეხოთ ჩარჩოები

თუ გსურთ ბმული გახსნას გვერდის ფარგლებს გარეთ (ანუ ჩაანაცვლოს მთელი ფრეიმსეტი), შეგიძლიათ გამოიყენოთ სპეციალური მნიშვნელობა _ზემო ატრიბუტისთვის სამიზნე. Მაგალითად:

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

როდესაც დააწკაპუნებთ "Exit Frames", ბრაუზერი ჩატვირთავს "pageOutofFrames.html" სრულ ფანჯარაში, ჩაანაცვლებს ჩარჩოს.

ეკრანის ორ სვეტად გაყოფის მაგალითი ჩარჩოებით

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

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

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

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

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

საუკეთესო ნავიგაციის მაგალითი HTML ჩარჩოებით

შექმენით ფაილი, რომელიც განსაზღვრავს ზედიზედ ორ ჩარჩოს. მისი განსაზღვრული ორი ფაილია: ერთი ნავიგაციისთვის (რომელიც იკავებს ფანჯრის სიგანის 20%-ს) და ერთი ძირითადი შინაარსისთვის (რომელიც იკავებს ფანჯრის დანარჩენ სიგანეს).

შემდეგი, თქვენ უნდა შექმნათ "navigation.html" და "content.html" ფაილები. მაგალითად, "navigation.html" შეიძლება ასე გამოიყურებოდეს:

Გვერდი 1

გვერდი 2

გვერდი 3


და "content.html" შეიძლება იყოს მსგავსი:

კეთილი იყოს თქვენი მობრძანება ჩვენს საიტზე!

აქ წავა ნავიგაციაში არჩეული გვერდის შინაარსი.

ამ შემთხვევაში „navigation.html“-ში ბმულზე დაწკაპუნებისას შესაბამისი გვერდი იტვირთება „კონტენტის“ ჩარჩოში.