Post on 26-Mar-2015
description
transcript
Colegiul Naţional de Informatică“Grigore Moisil” Braşov
Lucrare pentru atestarea competenţelorprofesionale
Profesor indrumător : Crăciun Alexandra
Elev : Agreşeanu Vlad – ŞtefanClasa : a XII-a C
Mai 2009
Cuprins
Cuprins..................................................................................................................................................2Motivaţia alegerii temei si utilitatea aplicaţiei............................................................3Structura aplicaţiei........................................................................................................................4Detalii tehnice de accesare......................................................................................................5Codul sursă.........................................................................................................................................6Resurse Hard şi Soft necesare..............................................................................................26Bibliografie........................................................................................................................................27
2
Motivaţia alegerii temei si utilitatea aplicaţiei
Motivul alegerii acestei teme a fost pasiunea pentru aviaţie ,
respectul pentru cei care şi-au dedicat viaţa si au contribuit la
dezvoltarea acestui domeniu.
Această lucrare se adreseaza tatălui meu care a fost unul din
OAMENII ce şi-au închinat viaţa Aviaţiei Române .
Aplicaţia este utilă tuturor utilizatorilor internetului pentru a se
informa asupra ISTORIEI AVIAŢIEI ROMÂNE. Aplicaţia prezintă o scurtă
istorie a celor mai renumiţi inventatori ai aviaţiei române .
Aplicaţia prezintă urmatoarele opţiuni :
- Scurt istoric :
Traian Vuia
Aurel Vlaicu
Henri Coandă
- Imagini :
Avioane
Schiţe
Inventatori
3
Structura aplicaţiei
Organizare :
Detalii tehnice de accesare
Home
Istorie Galerie Contact
Traian Vuia Aurel Vlaicu Henri Coandă
Istorie Traian Vuia
Date biograficeViaţa de
inventator
Istorie Aurel Vlaicu
Date biograficeViaţa de
inventator
Istorie Henri Coandă
Date biograficeViaţa de
inventator
4
Meniului programului cuprinde patru opţiuni : “ Meniu “ , “
Galerie “ , “ Istorie “ , “ Contact “ .
Alegerea opţiunii MENIU deschide pagina principală a site-ului şi
cuprinde toate adresele către paginile site-ului .
La alegerea opţiunii GALERIE se deschide un set de adrese către
toate prezentările photo din pagină . La apăsarea unei adrese , este
deschis , cu ajutorul efectului pop-up , câte un slide-show de poze .
La alegerea opţiunii ISTORIE se deschide un submeniu cu
adrese către cei trei inventatori cuprinşi in proiect . Fiecare inventator
are o scurtă prezentare a inovaţiei ( 2 – 3 pagini ).
La alegerea opţiunii CONTACT este deshisă o pagină prin
intermediul căreia se pot lăsa opinii despre acest site si poate fi
contactată persoana administratoare care se ocupă de proiect .
5
Acest proiect are o interfaţa uşor de utilizat , cu un aspect
plăcut , culorile folosite in nuanţe calde , care nu agasează
utilizatorul . Site-ul cuprinde adrese uşor de gasit , adrese care fac
legătura între toate informaţiile oferite .
Codul sursă
1. Meniu :
<head><title>Istoria Aviatiei - Home</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><!-- ImageReady Styles (Atestat.psd) --><style type="text/css"><!--body { // AŞEZAREA IN PAGINĂ A DIV-urilor
background-color:#000000; }#Table_01 {
position:absolute;left:252px;top:0px;width:800px;height:800px;
}
6
#home-01_ {position:absolute;left:0px;top:0px;width:800px;height:134px;
}
#home-02_ {position:absolute;left:0px;top:134px;width:706px;height:666px;
}
#home-03_ {position:absolute;left:706px;top:134px;width:70px;height:64px;
}
#home-04_ {position:absolute;left:776px;top:134px;width:24px;height:666px;
}
#home-05_ {position:absolute;left:706px;top:198px;width:70px;height:44px;
}
#home-06_ {position:absolute;left:706px;top:242px;width:70px;height:74px;
}
#home-07_ {
7
position:absolute;left:706px;top:316px;width:70px;height:43px;
}
#home-08_ {position:absolute;left:706px;top:359px;width:70px;height:69px;
}
#home-09_ {position:absolute;left:706px;top:428px;width:70px;height:56px;
}
#home-10_ {position:absolute;left:706px;top:484px;width:70px;height:74px;
}
#home-11_ {position:absolute;left:706px;top:558px;width:70px;height:242px;
}body {
background-color: #000000;margin-left: 250px;margin-right: 250px;background-image: url(file:///D|/ATESTAT/atestat/back.jpeg);
}.style2 {color: #000000}#apDiv1 {
position:absolute;left:682px;top:165px;
8
width:251px;height:150px;z-index:1;
}.style3 {font-size: 9px}.style4 {
font-size: 10px;font-family: "Century Gothic";color: #34342C;
}#apDiv2 {
position:absolute;left:683px;top:307px;width:265px;height:97px;z-index:2;
}.style5 {
font-size: 10px;font-family: "Century Gothic";color: #3F3B2F;
}#apDiv3 {
position:absolute;left:685px;top:353px;width:262px;height:52px;z-index:3;
}#apDiv4 {
position:absolute;left:671px;top:459px;width:264px;height:227px;z-index:4;
}.style9 {font-family: "Century Gothic"}
--></style><!-- End ImageReady Styles --></head>
// Alegerea culorii de background ,a fontului si introducerea textului in cuprinsul layout-ului
9
<body style="background-color:#FFFFFF;"><div class="style3" id="apDiv1"> <p class="style4"> Dorinta omului de a zbura cred ca s-a manifestat odata cu propria sa aparitie dar nu s-a fructificat decat dupa mii de ani. Izvoarele documentare scrise si orale cuprind multe date si imagini referitoare la incercarile si posibilitatile omului de a imita zborul pasarilor si, mai mult chiar,de a strabate distanta de la pamint pina la cel mai familiar astru, atit de intilnit in poezii si basme, luna.</p></div><div class="style5" id="apDiv2"> <p>“Putine natii din lume se pot mandri ca au contribuit<br /> la progresul aviatiei , cat a reusit natia romana…”<br />Henri Coanda</p></div><div id="apDiv3"> <p class="style4"> "Ma duc mama departe,la Paris,dar lasa mama<br /> sa nu-ti para rau ca am sa viu de acolo in zbor<br /> sau n-am sa mai vin niciodata acasa...”<br /><br /> </p></div><div class="style4" id="apDiv4"> <p><br /> Gheorghiu, Constantin C. -Aurel Vlaicu,un precursor al aviatiei romanesti - Gheorghiu, Constantin <br /> C.;Zaganescu, Florin --Din istoria industriei romanesti Aviatia Salca, Horia -Contributii romanesti in aviatieDeliu, Gheorghe –Mecanica aeronavelor <br /> -Colectia de reviste “Aeromagazin”</p></div><span class="style2"><!-- ImageReady Slices (Atestat.psd) --></span><div class="style2" id="Table_01"><div id="home-01_">
<img id="home_01" src="images/home_01.jpg" width="800" height="134" alt="" /> </div>
<div id="home-02_"><img id="home_02" src="images/home_02.jpg" width="706" height="666"
alt="" /> </div><div id="home-03_">
<img id="home_03" src="images/home_03.jpg" width="70" height="64" alt="" /> </div>
<div id="home-04_"><img id="home_04" src="images/home_04.jpg" width="24" height="666"
alt="" /> </div><div id="home-05_">
<img id="home_05" src="images/home_05.jpg" width="70" height="44" alt="" /> </div>
<div id="home-06_">
10
<img id="home_06" src="images/home_06.jpg" width="70" height="74" alt="" /> </div>
<div id="home-07_"><img id="home_07" src="images/home_07.jpg" width="70" height="43"
alt="" /> </div><div id="home-08_">
<img id="home_08" src="images/home_08.jpg" width="70" height="69" alt="" /> </div>
<div id="home-09_"><img id="home_09" src="images/home_09.jpg" width="70" height="56"
alt="" /> </div><div id="home-10_">
<img id="home_10" src="images/home_10.jpg" width="70" height="74" alt="" /> </div>
<div id="home-11_"><img id="home_11" src="images/home_11.jpg" width="70" height="242"
alt="" /> </div></div><span class="style2"><!-- End ImageReady Slices --></span></body></html>
2. Galerie :
<head><title>Galerie</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><!-- ImageReady Styles (Atestat.psd) --><style type="text/css"><!—
// AŞEZAREA IN PAGINĂ A DIV-urilor
body {background-image:url(back.jpeg);margin-left: 250px;margin-right: 250px;
}
#Table_01 {position:absolute;left:251px;top:1px;
11
width:800px;height:800px;
}
#Atestat-01_ {position:absolute;left:0px;top:0px;width:800px;height:133px;
}
#Atestat-02_ {position:absolute;left:0px;top:133px;width:705px;height:667px;
}
#Atestat-03_ {position:absolute;left:705px;top:133px;width:67px;height:63px;
}
#Atestat-04_ {position:absolute;left:772px;top:133px;width:28px;height:667px;
}
#Atestat-05_ {position:absolute;left:705px;top:196px;width:67px;height:46px;
}
#Atestat-06_ {position:absolute;left:705px;top:242px;width:67px;
12
height:61px;}
#Atestat-07_ {position:absolute;left:705px;top:303px;width:67px;height:53px;
}
#Atestat-08_ {position:absolute;left:705px;top:356px;width:67px;height:72px;
}
#Atestat-09_ {position:absolute;left:705px;top:428px;width:67px;height:41px;
}
#Atestat-10_ {position:absolute;left:705px;top:469px;width:67px;height:77px;
}
#Atestat-11_ {position:absolute;left:705px;top:546px;width:67px;height:254px;
}
--></style><!-- End ImageReady Styles --></head>
13
// Alegerea culorii de background ,a fontului şi introducerea textului in cuprinsul layout-ului
<body style="background-color:#FFFFFF;"><!-- ImageReady Slices (Atestat.psd) --><div id="Table_01"><div id="Atestat-01_">
<img id="Atestat_01" src="images/Atestat_01.jpg" width="800" height="133" alt="" />
</div><div id="Atestat-02_">
<img id="Atestat_02" src="images/Atestat_02.jpg" width="705" height="667" alt="" />
</div><div id="Atestat-03_">
<img id="Atestat_03" src="images/Atestat_03.jpg" width="67" height="63" alt="" />
</div><div id="Atestat-04_">
<img id="Atestat_04" src="images/Atestat_04.jpg" width="28" height="667" alt="" />
</div><div id="Atestat-05_">
<img id="Atestat_05" src="images/Atestat_05.jpg" width="67" height="46" alt="" />
</div><div id="Atestat-06_">
<img id="Atestat_06" src="images/Atestat_06.jpg" width="67" height="61" alt="" />
</div><div id="Atestat-07_">
<img id="Atestat_07" src="images/Atestat_07.jpg" width="67" height="53" alt="" />
</div><div id="Atestat-08_">
<img id="Atestat_08" src="images/Atestat_08.jpg" width="67" height="72" alt="" />
</div><div id="Atestat-09_">
<img id="Atestat_09" src="images/Atestat_09.jpg" width="67" height="41" alt="" />
</div><div id="Atestat-10_">
<img id="Atestat_10" src="images/Atestat_10.jpg" width="67" height="77" alt="" />
</div><div id="Atestat-11_">
<img id="Atestat_11" src="images/Atestat_11.jpg" width="67" height="254" alt="" />
14
</div></div><!-- End ImageReady Slices --></body></html>
3. Istorie :
<head><title>Atestat</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><!-- ImageReady Styles (Atestat.psd) --><style type="text/css"><!--
// AŞEZAREA IN PAGINĂ A DIV-urilor
#Table_01 {position:absolute;left:224px;top:0px;width:800px;height:800px;
}
#istorie-01_ {position:absolute;left:0px;top:0px;width:800px;height:134px;
}
#istorie-02_ {position:absolute;left:0px;top:134px;width:705px;height:70px;
}
#istorie-03_ {position:absolute;left:705px;top:134px;width:70px;
15
height:60px;}
#istorie-04_ {position:absolute;left:775px;top:134px;width:25px;height:666px;
}
#istorie-05_ {position:absolute;left:705px;top:194px;width:70px;height:51px;
}
#istorie-06_ {position:absolute;left:0px;top:204px;width:486px;height:596px;
}
#istorie-07_ {position:absolute;left:486px;top:204px;width:148px;height:38px;
}
#istorie-08_ {position:absolute;left:634px;top:204px;width:71px;height:596px;
}
#istorie-09_ {position:absolute;left:486px;top:242px;width:148px;height:35px;
16
}
#istorie-10_ {position:absolute;left:705px;top:245px;width:70px;height:58px;
}
#istorie-11_ {position:absolute;left:486px;top:277px;width:148px;height:29px;
}
#istorie-12_ {position:absolute;left:705px;top:303px;width:70px;height:75px;
}
#istorie-13_ {position:absolute;left:486px;top:306px;width:148px;height:494px;
}
#istorie-14_ {position:absolute;left:705px;top:378px;width:70px;height:40px;
}
#istorie-15_ {position:absolute;left:705px;top:418px;width:70px;height:56px;
}
17
#istorie-16_ {position:absolute;left:705px;top:474px;width:70px;height:69px;
}
#istorie-17_ {position:absolute;left:705px;top:543px;width:70px;height:257px;
}body {
background-image: url(../back.jpeg);}
--></style><!-- End ImageReady Styles --></head>
// Alegerea culorii de background ,a fontului şi introducerea textului in cuprinsul layout-ului
<body style="background-color:#FFFFFF;"><!-- ImageReady Slices (Atestat.psd) --><div id="Table_01"><div id="istorie-01_">
<img id="istorie_01" src="images/istorie_01.jpg" width="800" height="134" alt="" />
</div><div id="istorie-02_">
<img id="istorie_02" src="images/istorie_02.jpg" width="705" height="70" alt="" />
</div><div id="istorie-03_">
<a href="../Home/home.html"><img src="images/istorie_03.jpg" alt="" name="istorie_03" width="70" height="60" border="0" id="istorie_03" /></a> </div><div id="istorie-04_">
<img id="istorie_04" src="images/istorie_04.jpg" width="25" height="666" alt="" />
</div><div id="istorie-05_">
18
<img id="istorie_05" src="images/istorie_05.jpg" width="70" height="51" alt="" />
</div><div id="istorie-06_">
<img id="istorie_06" src="images/istorie_06.jpg" width="486" height="596" alt="" />
</div><div id="istorie-07_">
<a href="traianvuia1.html"><img src="images/istorie_07.jpg" alt="" name="istorie_07" width="148" height="38" border="0" id="istorie_07" /></a> </div><div id="istorie-08_">
<img id="istorie_08" src="images/istorie_08.jpg" width="71" height="596" alt="" />
</div><div id="istorie-09_">
<a href="Aurelvlaicu1.html"><img src="images/istorie_09.jpg" alt="" name="istorie_09" width="148" height="35" border="0" id="istorie_09" /></a> </div><div id="istorie-10_">
<a href="../Galerie/Atestat.html"><img src="images/istorie_10.jpg" alt="" name="istorie_10" width="70" height="58" border="0" id="istorie_10" /></a> </div>
<div id="istorie-11_"><a href="Henricoanda1.html"><img src="images/istorie_11.jpg"
alt="" name="istorie_11" width="148" height="29" border="0" id="istorie_11" /></a> </div><div id="istorie-12_">
<img id="istorie_12" src="images/istorie_12.jpg" width="70" height="75" alt="" />
</div><div id="istorie-13_">
<img id="istorie_13" src="images/istorie_13.jpg" width="148" height="494" alt="" />
</div><div id="istorie-14_">
<a href="istorie.html"><img src="images/istorie_14.jpg" alt="" name="istorie_14" width="70" height="40" border="0" id="istorie_14" /></a> </div><div id="istorie-15_">
<img id="istorie_15" src="images/istorie_15.jpg" width="70" height="56" alt="" />
</div><div id="istorie-16_">
<img id="istorie_16" src="images/istorie_16.jpg" width="70" height="69" alt="" />
</div><div id="istorie-17_">
19
<img id="istorie_17" src="images/istorie_17.jpg" width="70" height="257" alt="" />
</div></div><!-- End ImageReady Slices --></body></html>
4. Contact:
<head><title>Atestat</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><!-- ImageReady Styles (Atestat.psd) --><style type="text/css"><!—
// AŞEZAREA IN PAGINĂ A DIV-urilor
#Table_01 {position:absolute;left:225px;top:0px;width:800px;height:800px;
}
#contct-01_ {position:absolute;left:0px;top:0px;width:800px;height:134px;
}
#contct-02_ {position:absolute;left:0px;top:134px;width:705px;height:417px;
}
#contct-03_ {position:absolute;left:705px;top:134px;width:70px;
20
height:60px;}
#contct-04_ {position:absolute;left:775px;top:134px;width:25px;height:666px;
}
#contct-05_ {position:absolute;left:705px;top:194px;width:70px;height:51px;
}
#contct-06_ {position:absolute;left:705px;top:245px;width:70px;height:58px;
}
#contct-07_ {position:absolute;left:705px;top:303px;width:70px;height:75px;
}
#contct-08_ {position:absolute;left:705px;top:378px;width:70px;height:40px;
}
#contct-09_ {position:absolute;left:705px;top:418px;width:70px;height:56px;
21
}
#contct-10_ {position:absolute;left:705px;top:474px;width:70px;height:69px;
}
#contct-11_ {position:absolute;left:705px;top:543px;width:70px;height:257px;
}
#contct-12_ {position:absolute;left:0px;top:551px;width:175px;height:249px;
}
#contct-13_ {position:absolute;left:175px;top:551px;width:110px;height:12px;
}
#contct-14_ {position:absolute;left:285px;top:551px;width:420px;height:249px;
}
#contct-15_ {position:absolute;left:175px;top:563px;width:110px;height:237px;
}
22
body {background-image: url(../back.jpeg);
}#apDiv1 {
position:absolute;left:655px;top:149px;width:249px;height:328px;z-index:1;
}.style1 {
font-family: "Century Gothic";font-weight: bold;
}.style2 {color: #43432a}.style3 {color: #43432a; font-style: italic; }
--></style><!-- End ImageReady Styles -->
// Alegerea culorii de background ,a fontului şi introducerea textului in cuprinsul layout-ului
</head>
<body style="background-color:#FFFFFF;"><!-- ImageReady Slices (Atestat.psd) --><div id="Table_01">
<div id="contct-01_"><img id="contct_01" src="images/contct_01.jpg" width="800" height="134" alt=""
/></div><div id="contct-02_">
<img id="contct_02" src="images/contct_02.jpg" width="705" height="417" alt="" /> </div>
<div id="contct-03_"><a href="../Home/home.html"><img src="images/contct_03.jpg"
alt="" name="contct_03" width="70"
height="60" border="0" id="contct_03" /></a> </div><div id="contct-04_">
<img id="contct_04" src="images/contct_04.jpg" width="25" height="666" alt="" /> </div>
<div id="contct-05_">
23
<img id="contct_05" src="images/contct_05.jpg" width="70" height="51" alt="" /> </div>
<div id="contct-06_"><a href="../Galerie/Atestat.html"><img src="images/contct_06.jpg"
alt="" name="contct_06"
width="70" height="58" border="0" id="contct_06" /></a> </div><div id="contct-07_">
<img id="contct_07" src="images/contct_07.jpg" width="70" height="75" alt="" /> </div>
<div id="contct-08_"><a href="../Istorie/istorie.html"><img src="images/contct_08.jpg"
alt="" name="contct_08"
width="70" height="40" border="0" id="contct_08" /></a> </div><div id="contct-09_">
<img id="contct_09" src="images/contct_09.jpg" width="70" height="56" alt="" /> </div>
<div id="contct-10_"><a href="contct.html"><img src="images/contct_10.jpg" alt=""
name="contct_10" width="70"
height="69" border="0" id="contct_10" /></a> </div><div id="contct-11_">
<img id="contct_11" src="images/contct_11.jpg" width="70" height="257" alt="" /> </div>
<div id="contct-12_"><img id="contct_12" src="images/contct_12.jpg" width="175"
height="249" alt="" /> </div><div id="contct-13_">
<img id="contct_13" src="images/contct_13.jpg" width="110" height="12" alt="" /> </div>
<div id="contct-14_"><img id="contct_14" src="images/contct_14.jpg" width="420"
height="249" alt="" /> </div><div id="contct-15_">
<img id="contct_15" src="images/contct_15.jpg" width="110" height="237" alt="" /> </div></div>
<!-- End ImageReady Slices --><div class="style1" id="apDiv1"><form method="post" action="mailto:youremail@email.com"> <p>Nume: </p> <p> <input type="text" size="20" maxlength="40" name="name"> </p> <p>Pareri :</p> <p>
24
<textarea rows="5" cols="20" wrap="physical" name="comments"></textarea> </p> <p> <input name="Reset" type="reset" value="Reset" /> <br /> <input name="Submit" type="submit" value="Trimite"> </p></form></div> </p></div></body></html>
Resurse Hard şi Soft necesare
Rularea acestui program implică puţine resurse hard si soft .Calculatorul şi componentele sal reprezintă resursa hard principală . Resursa soft utilizată este explorerul GOOGLE CHROME.
Probleme de browser
Pe masura ce vom aprofunda folosirea CSS-ului, veti descoperi ca nu toate browserele interpreteaza la fel stilurile. CSS-ul va fi interpretat diferit de browsere, ceea ce va va cauza dureri de cap. Exista totusi metode de rezolvare a acestor metode pe care le vom explica la momentul potrivit.
25
Bibliografie
-Gheorghiu, Constantin C. -Aurel Vlaicu,un precursor al aviatiei romanesti - -Gheorghiu, Constantin -C.Zaganescu, Florin -- Din istoria industriei romanesti Aviatia Salca-Contributii romanesti in aviatie Deliu, Gheorghe –Mecanica aeronavelor -Colectia de reviste “Aeromagazin”
26