CADRE ÎN HTML
Presentation
•
Computers
•
11th Grade
•
Practice Problem
•
Hard
Gabriela Gitu
Used 9+ times
FREE Resource
12 Slides • 5 Questions
1
CADRE ÎN HTML
FRAMESET, FRAME şi IFRAME
2
Sunt situatii in care imaginea afisata de browser este formată din
mai multe pagini HTML numite cadre.
Cadrele permit împărţirea unei ferestre în secţiuni independente
între ele, în fiecare dintre acestea fiind posibilă încărcarea unui
document HTML. Astfel, utilizatorul poate vizualiza simultan mai multe documente.
3
Pentru structurarea unui document HTML în cadre sunt
utilizate tagurile:
• <frameset>
• <frame>
• <noframe>
• <iframe>
4
Un document cu cadre se realizează similar unui document
HTML oarecare, în care tagurile <body>, respectiv </body> sunt
înlocuite cu tagurile <frameset>, respectiv </frameset>:
<html>
<head>
</head>
<frameset>
…
</frameset>
</html>
Aşadar, tagul <frameset> permite structurarea documentului
principal în cadre. În interiorul perechii <frameset> </frameset>
nu pot exista decât elemente <frameset>, <frame>, <noframe>.
5
Tagul <frameset> acceptă următoarele atribute:
rows – primeşte ca parametru o listă de valori, separate prin virgulă, ce reprezintă
înălţimea cadrelor orizontale ale documentului principal. Numărul de cadre orizontale
este dat de numărul de valori din listă. Valorile sunt exprimate fie prin numere întregi
pozitive (înălţime absolută exprimată în pixeli), fie prin procente din înălţimea cadrului
părinte (înăţime relativă), fie prin caracterul de puncuaţie „*‟, care semnifică o înălţime
relativă.
cols – permite împărţirea cadrului curent în sectoare verticale. Parametrii acceptaţi
respectă aceleaşi reguli ca şi în cazul atributului rows, numai că se referă la lungimea
cadrului.
border – primeşte o valoare întreagă nenegativă, reprezentând grosimea, exprimată
în pixeli, a chenarului cadrelor. Implicit, grosimea chenarului este de 5 pixeli. Valoarea
0 a atributului border inhibă afişarea chenarelor tuturor cadrelor.
bordercolor – permite setarea culorii chenarelor cadrelor. Culoarea poate fi
specificată fie printr-un triplet hexa de forma #rrggbb, fie printr-un nume predefinit de
culoare.
frameborder – controleaza afişarea/ascunderea chenarelor tuturor cadrelor. Atributul
poate primi valorile: yes sau 1 (se forţează afişarea chenarelor), no sau 0 ( se forţează
ascunderea chenarelor);
framespacing – permite specificarea distanţei, în pixeli, de spaţiu liber în jurul tuturor
cadrelor. Dacă framespacing=0, cadrele nu pot fi redimensionate cu drag and
drop (adică prin tragere cu mouse-ul).
6
Cadrele sunt introduse prin perechea de etichete <frame>
</frame>,si suporta atributele:
• src fisierul sau adresa fisierului introdus
• bordercolor culoarea chenarului cadrului curent conform
modelului #rrggbb
• noresizedezactiveaza
posibilitatea
vizitatorului
de
a
redimensiona cadrul
• scrolling
adaugă
cadrului
bare
de
defilare
cu
valorile yes,no sau auto
• name – specifică numele cadrului, nume ce va fi utilizat pentru
referirea cadrului respectiv atunci când se va încărca în el un
alt document HTML, prin intermediul unei hiperlegături aflate în
alt cadru. Numele este o combinaţie de caractere alfanumerice;
7
Tagul <noframe> este utilizat în cazul în care se
navighează cu un browser mai vechi, care nu suportă
cadrele. În această situaţie, browserul va afişa conţinutul
inclus în interiorul perechii <noframe> </noframe>. Dacă
însă, browserul recunoaşte cadrele, el va ignora conţinutul
perechii <noframe> </noframe>.
8
Realizaţi o pagină html numită index.html care să fie
împărţită în 2 cadre verticale.
• Rezolvare:
• Fişierul index.html va avea următorul conţinut:
• <html>
<head><title>Exemplu cadre</title></head>
<frameset cols="20%,80%">
<frame src=“paginastanga.html”>
<frame src=“exersarelink.html" name="mainFrame">
</frameset>
</html>
9
Rezultat
10
Pagina impartita in 3 cadre
<html>
<head><title>Exemplu cu cadre</title>
</head>
<frameset cols= "180,*" border=0>
<frame src="paginastanga.html" noresize >
<frameset rows = "120, *" border = 0>
<frame src="imagine.png" scrolling="no">
<frame src="exersarelink.html"
name="cadrul2">
</frameset>
</frameset>
</html>
11
Rezultat
12
Multiple Choice
Cadrele sunt folosite pentru:
împărţirea unui document Notepad în secţiuni independente între ele, în fiecare dintre acestea fiind posibilă încărcarea unui document HTML
împărţirea unei ferestre în secţiuni independente între ele, în fiecare dintre acestea fiind posibilă încărcarea unui document HTML
crearea unor secţiuni independente între ele, în fiecare dintre acestea fiind posibilă încărcarea unui document
împărţirea unei ferestre în secţiuni independente între ele, în fiecare dintre acestea fiind posibilă încărcarea unor documente
13
Fill in the Blanks
Type answer...
14
Multiple Select
Ce atribute acceptă tagul <frameset> ?
rows
align
frameborder
color
cols
15
Fill in the Blanks
Type answer...
16
Multiple Choice
Care este atributul obligatoriu pentru eticheta <frame>
bordercolor
noresize
scrolling
src
name
17
Aplicatie
Realizati o pagina cu doua cadre orizontale in proportia
20% si 80% din inaltimea totala. Pagina de sus are
chenarul rosu iar cea de jos are scroll.
CADRE ÎN HTML
FRAMESET, FRAME şi IFRAME
Show answer
Auto Play
Slide 1 / 17
SLIDE
Similar Resources on Wayground
13 questions
Present Simple & Present Continuous
Presentation
•
11th Grade
15 questions
Pengenalan Internet
Presentation
•
11th Grade
12 questions
38 JavaScript Wyświetlanie komunikatów
Presentation
•
KG
11 questions
Moblie Apps SAC
Presentation
•
11th Grade
14 questions
Lección Diseño Web
Presentation
•
11th Grade
9 questions
Strings in C++
Presentation
•
11th Grade
15 questions
Snake Python
Presentation
•
KG
11 questions
Baze de date - prelucrarea datelor cu SQL
Presentation
•
11th - 12th Grade
Popular Resources on Wayground
11 questions
Hallway & Bathroom Expectations
Quiz
•
6th - 8th Grade
10 questions
HCS SCI 03 Summer School Assessment 2
Quiz
•
3rd Grade
11 questions
Home Scope
Quiz
•
7th - 8th Grade
12 questions
2026 TAP Technology in the Classroom
Presentation
•
Professional Development
15 questions
HCS SCI 05 Summer School Assessment 2 Review
Quiz
•
5th Grade
15 questions
HCS SCI 04 Summer School Review 2
Quiz
•
4th Grade
59 questions
Geometry Unit 3 Review
Quiz
•
9th - 12th Grade
14 questions
FAST ELA READING SMAPLE TEST MATERIALS
Passage
•
3rd Grade