220 likes | 345 Views
Tehnologii asistate de calculator. Autor : prof . CERCEL Ana Maria. Cuprins. Programe pentru codul HTML Invatarea HTML presupune : Despre tag- uri Tipuri de tag- uri Structura unui document HTML Exemple TAG- uri utile.
E N D
Tehnologiiasistate de calculator Autor: prof. CERCEL Ana Maria
Cuprins • ProgramepentrucodulHTML • Invatarea HTML presupune: • Despretag-uri • Tipuri de tag-uri • Structuraunui document HTML • Exemple • TAG-uri utile
Prescurtarea de la Hypertext Markup Language, ceeacereprezinta de faptlimbajulpe care browserele de internet ilintelegsi cu ajutorullui pot fiafisatepaginile web
Programepentrucodul HTML Acesteprograme se numesceditoare HTML si pot fi de douatipuri: editoareclasicesieditoare de tipul WYSIWYG (What You See Is What You Get) Obs: cele mai bune editoare HTML nu sunt gratuite
Invatarea HTML presupune: • sa stii sa utilizezi un editor de text (ex: Notepad etc.) • sa ai cel putin un browser de internet (ex: Microsoft Internet Explorer, Netscape Comunicator etc.) • sa-ti faci un pic de timp liber (de exemplu o jumatate de ora pe zi)
Despre tag-uri Tag-urile nu suntaltcevadecatnistemarcajesauetichetepe care limbajul HTML le folosestealaturi de textepentru a ajuta browser-ul de internet saafisezecorectcontinutulpaginii web.
Tipuri de tag-uri - tag-uripereche (un tag de inceputsiunul de incheiere). Exemple: <HTML> si </HTML>; <TITLE> si </TITLE>; <HEAD> si </HEAD>; - tag-urisingulare (nu au un tag de incheiere) Exemple: <HR>, <BR>.
Structuraunui document HTML <html> <title> </title> <head> </head> <body> </body> </html>
Explicatii • <html> </html>Prinfolosireaacestui tag ii spunem browser-ului ca estevorba de un fisier HTML pentru a ilputeadeschidesiinchide • <title></title> titluldocumentului, al paginii • <head> </head> titlulpaginii • <body></body> corpulpaginiicecontine tot cevafiafisatpeecran.
Exemplu <html> <title> NUMELE SI PRENUMELE</title> <head>PRIMA MEA PAGINA</head> </html> Artrebuisaarateasa:link
Alt exemplu <HTML><HEAD><TITLE>Prima mea pagina web</TITLE></HEAD><BODY>Bineaivenit!<BR>Vominvataimpreunalimbajul HTML. Aceastaeste prima mea pagina web!<BR></BODY></HTML> Obs. Am folosit <br> pentru a-I spune browser-ului ca ceea ce este scris dupa br trebuie scris pe randul urmator. <br> nu are tag de inchidere.
Taguri utile <body bgcolor=“red”></body> aplicaculoarefundalului <font color=“green” size=“6” face=“comics sans ms”></font> stabilesteculoarea, marimeasistilulcaracterelor din text <center></center> afiseaza in centrupaginii <left></left> afiseaza la stanga <right></right> afiseaza la dreapta
Exemplul3 <html> <title> Numelesiprenumele </title> <head> <center> PRIMA MEA PAGINA</center> </head> <body bgcolor=“red”><left> <font size=“6” color=“green” face=“comic sans ms”>Bineaivenit!<BR>Vominvataimpreunalimbajul HTML. Aceastaeste prima mea pagina web!<BR></font></left> </body> </html>
Introducereauneiimaginisau a uneilegaturi • Se pot introduce imagini jpg, jpeg, gif, etc. Tag-ulutilizateste: <imgsrc=“numelepozei.extensia”/> • Pentruintroducereaunui link folosim: • <a href="http://www.google.com"></a>
Exemplul 4 • <html> • <title> • Numelesiprenumele • </title> • <head> • <center> PRIMA MEA PAGINA</center> • </head> • <body bgcolor="pink"><right> • <font size=“6” colour=“black” face=“comic sans ms”>Bineaivenit!<BR>Vominvataimpreunalimbajul HTML. • <center><imgsrc="taj-mahal.gif"/></center> • <a href="http://www.google.com"> • <font size="4" face="comics sans ms">Click pe link pentru a ajunge la Google:</font></P></a> • </body> • </html>
Pentruinformatiisuplimentare: • http://www.w3schools.com/html/ • http://en.wikipedia.org/wiki/HTML • http://www.tutorialehtml.com/ • http://www.htmlgoodies.com/ • http://www.w3.org/MarkUp/
Bibliografie • Metodica predării informaticii, Editura Arves, 2006, Craiova • Suport de curs: „Mediişitehnologiieducaţionale interactive” • Suport de curs: „Informatică aplicată în educaţie şi formare” • www.flexform.ro • www.google.ro • http://www.tutorialehtml.com/ • http://www.w3schools.com/css/
Recapitulare • HTML = Hypertext Markup Language • TAG = marcajesauetichetepe care limbajul HTML le folosestealaturi de textepentru a ajuta browser-ul de internet saafisezecorectcontinutulpaginiiweb • Tipuri de tag-uri: singularesipereche