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
10 questions
Introducción al diseño web
Presentation
•
11th Grade
13 questions
Cân bằng nội môi
Presentation
•
11th Grade
12 questions
2º TRIMESTRE- HTML E CSS
Presentation
•
11th Grade
13 questions
Structuri. Vectori de structuri
Presentation
•
11th Grade
13 questions
Conditional Statement
Presentation
•
11th Grade
16 questions
ASESMEN AWAL PERHITUNGAN KIMIA
Presentation
•
11th Grade
10 questions
Triangle Inequality Theorem
Presentation
•
10th - 12th Grade
12 questions
Estructuras de selección C++
Presentation
•
12th Grade
Popular Resources on Wayground
20 questions
"What is the question asking??" Grades 3-5
Quiz
•
1st - 5th Grade
20 questions
“What is the question asking??” Grades 6-8
Quiz
•
6th - 8th Grade
10 questions
Fire Safety Quiz
Quiz
•
12th Grade
20 questions
Equivalent Fractions
Quiz
•
3rd Grade
34 questions
STAAR Review 6th - 8th grade Reading Part 1
Quiz
•
6th - 8th Grade
20 questions
“What is the question asking??” English I-II
Quiz
•
9th - 12th Grade
20 questions
Main Idea and Details
Quiz
•
5th Grade
47 questions
8th Grade Reading STAAR Ultimate Review!
Quiz
•
8th Grade
Discover more resources for Computers
20 questions
“What is the question asking??” English I-II
Quiz
•
9th - 12th Grade
10 questions
Fire Prevention
Quiz
•
9th - 12th Grade
41 questions
US History STAAR Review
Quiz
•
11th Grade
20 questions
Grammar
Quiz
•
9th - 12th Grade
16 questions
AP Biology: Unit 1 Review (CED)
Quiz
•
9th - 12th Grade
20 questions
verbos reflexivos en español
Quiz
•
9th - 12th Grade
20 questions
US History EOC STAAR 2022 Review Set 1
Quiz
•
11th Grade
11 questions
Expectations Review
Quiz
•
9th - 12th Grade