LICEU Atestat

LICEU
Atestat la Informatica
INOVARE SI PROGRES
Indrumator: Autor:
Prof.Indrumator elev NUME PRENUME
AN
CUPRINS
Introducere .......................................................... 3
Despre HTML & CSS ..........................................4
Tema.Argument ....................................................8
Detalii tehnice .......................................................9
Structura .............................................................11
Index ....................................................................12
Cod Sursa ............................................................13
Bibliografie ..........................................................23
INTRODUCERE
INOVARE SI PROGRES este un website destinat tutuor elevilor si
celorlalte persoane care vor sa afle, in termeni succinti, informatii esentiale
despre inovare, inventica si rolul lor in progresul omenirii.
De asemenea, site-ul dispune de o categorie ampla, in care sunt prezentati pe
scurt, cei mai mari si mai influneti inovatori si inventatori ai lumii, din
antichitate si pana in zilele noastre.
Motivul pentru care am ales aceasta tema este lipsa de informatii despre
acest subiect, superficialitatea cu care este tratat si mai ales lipsa aprecierii fata
de marii invetatori ai omenirii.
Scopul acestui site este de a ajuta pe cei care il rasfoiesc, sa constientizeze ca
adevaratele vedete si persoanele demne de lauda sunt marii inventatori, care au
ajutat progresul omenirii, si nu vedetele false, fabricate, formaliste.
Website-ul este creat cu ajutorul limbajului HTML ( HyperText Markup
Language ) si CSS ( Cascade Style Sheet ), doua limbaje care stau la baza
World Wide Web-ului.
Pe viitor daca proiectul se dovedeste util si interesant, am de gand
imbunatatirea lui si urcarea lui pe un host, pentru a fi disponibil oricui doreste
sa se informeze despre acesti oameni sclipitori.
DESPRE HTML & CSS
NOTIUNI GENERALE
HTML(HyperText
HTML Markup Language) este un limbaj simplu, compus din
coduri speciale (marcaje) care se inserează într-un text pentru a adăuga
informaţii despre formatare. Este derivat din SGML (Standard Generalized
Markup Language), un sistem pentru definirea tipurilor de documente
structurate, destinat să reprezinte instanţe ale acestor tipuri de documente. La
baza SGML şi a HTML se află acelaşi principiu: descrierea conţinutului unui
document se face într-un fişier text obişnuit (ASCII). Se urmăreşte ca aceste
fişiere să fie editabile cu aplicaţii software nepretenţioase (exemplu Notepad,
WordPad).
În cadrul unui document HTML, un marcaj (tag, în limba engleză) va
avea forma <nume_marcaj>. Parantezele unghiulare sunt elementele care
indică prezenţa unui marcaj; numele marcajelor poate fi scris oricum, limbajul
nefiind senzitiv la literele mari/mici (case sensitive). Unele marcaje permit
utilizarea unor atribute care se vor scrie în marcajul de început:
<nume_marcaj optiune1=valoare1 optiune2=valoare2 ...>
................
</nume_marcaj>
Există două tipuri de marcaje:

individuale (exemplu <br>);
perechi (exemplu <p>...</p>) - de menţionat că sfârşitul unui marcaj este
indicat prin utilizarea caracterului „/” în faţa numelui de marcaj.
STRUCTURA UNUI DOCUMENT HTML
Un document HTML 4 are următoarea structură:

o linie conţinând versiunea HTML;
secţiunea HEAD, delimitată de marcajele <HEAD> ... </HEAD>;
secţiunea BODY, delimitată de marcajele <BODY> ... </BODY> sau
<FRAMESET> ... </FRAMESET>.
INSERAREA UNEI IMAGINI IN HTML
În principal, utilizarea imaginilor (pozelor) în cadrul paginilor HTML are

ca scop îmbunătăţirea modului de transmitere a mesajului către utilizatori. O
pagină în care imaginile sunt combinate cu textul poate transmite un mesaj mult
mai bine decât o pagină care conţine doar text.
Formatele de fişiere grafice universal recunoscute de browse-re sunt:
GIF - GRAPHICS INTERCHANGE FORMAT - este un format de compresie
fără pierdere de calitate;
JPG - format introdus de JOINT PHOTOGRAPHIC EXPERT GROUP - este un

format de compresie cu pierdere de calitate. Prin salvarea repetată a unei
imagini, ea va pierde din calitate, devenind în final inutilizabilă;
PNG - PORTABLE NETWORK GRAPHIC - este un format de compresie fără

pierdere de calitate. Are în general dimensiuni mai mari decât primele două
formate menţionate. Introducerea unei imagini într-o pagină HTML se face prin
marcajul <img>.
Atributul src specifică locaţia imaginii. Alături de src, marcajul <img>
are următoarele atribute:
alt - specifică un text alternativ pentru cazul în care imaginea nu poate fi

afişată. Este important şi pentru motoarele de căutare;
border - trasează un chenar în jurul imaginii;
width, height - specifică lăţimea, respectiv înălţimea imaginii. Nu sunt

obligatorii, însă utilizarea lor este recomandată deoarece va reduce timpul de
procesare a paginii web de către browser;
hspace, vspace - specifică spaţiul care va fi păstrat în jurul unei imagini.
INSERAREA UNUI FORMULAR IN HTML
Formularele sunt introduse prin marcajul <form>...</form>.

Perechea <form>...</form> este o secţiune a paginii HTML (container)
care include mai multe controale (elemente).
Într-o pagină HTML pot exista mai multe formulare, însă numai
informaţiile dintr-un singur formular pot fi trimise la un anumit moment către
server.
CASCADE STYLE SHEET
CSS este un acronim provenind din Cascading Style Sheets, care inseamna
“foi de stil in cascada” (cea mai apropiata traducere). In documentele W3C,
CSS nu e definit ca un nou limbaj, ci ca un mecanism care permite formatarea
documentului HTML.
CSS-ul nu exclude HTML-ul din pagina web. Nu se poate realiza o pagina web
folosind numai CSS, care a fost proiectat astfel incat sa conlucreze cu HTML-
ul. Folosind CSS, se ajunge
1.un control mai fin asupra paginii web
2. scaderea dimensiunii in KB a paginii web, atunci cand codul CSS e
continut intr-un fisier extern
3. o mai mare comoditate: modificand fisierul CSS extern, modificati
simultan toate paginile web in care acesta e inclus
4. efecte mai sofisticate decat cele produse de codul HTML: suprapunerea
unei imagini peste alta imagine, a unui text peste alt text, impresia de relief,
efectul hover, afisarea unor fonturi mai mari decat h1 si multe altele.
Exemplu de cod :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Titlu pagina</title>
</head>
<body>
<div id="container">
<div id="header">
<h1>Titlu site</h1>
<p>descriere site</p>
</div> 
<div id="continut">
<h1>Titlu articol</h1>
<p> acesta este continutul, iar acesta este un <a href="#">link</a>
</div> 
</div> 
</body>
</html>
TEMA.ARGUMENT
Tema inventicii si a progresului omenirii este rareori regasita in atestatele
de acest gen, acesta fiind unul dintre motivele pentru care am aleso.
Alt motiv pentru care am ales aceasta tema este pasiunea.Intotdeauna m-au
pasionat stiintele, descoperirile, inventiile si inovatiile si gandesc, pe buna
dreptate ca marii inventatori si nu doar ei, au fost privati secole intregi de gloria
bine meritata, in dauna altor personaje.
Invenţiile au modelat lumea în care trăim. În fiecare zi beneficiem de pe
urma muncii marilor inventatori: când aprindem lumina, folosim computerul,
telefonăm cuiva sau ne uităm la un film. Invenţiile simple, cum ar fi nasturii,
fermoarele, Coca-Cola sau fulgii de porumb, ne fac viaţa mai uşoară şi mai
plăcută. Unii inventatori muncesc ani întregi la descoperirile şi opiniile.
Faimosul inventator Thomas Edison a spus că „geniul este 1% inspiraţie şi 99%
transpiraţie”.
El a inventat becul electric, dar numai după ce a făcut mii de experimente!
Fiecare invenţie aduce informaţii noi, utilizate pentru a da naştere altor invenţii.
Inventatorii îşi protejează invenţiile obţinând brevete de la autorităţile abilitate,
prin care ei îşi dezvăluie secretele în schimbul dreptului de a realiza, utiliza sau
vinde invenţiile. Brevetele au o viaţă scurtă, de până la 21 de ani, după care
invenţia devine proprietate publică. În ultimii 500 de ani, au fost inventate şi
patentate peste 25 milioane de produse, procese şi dispozitive.
Este greu să prognozăm toate efectele posibile ale unei invenţii. În 1867,
după trei ani de muncă, inventatorul suedez Alfred Nobel a stabilizat
nitroglicerina, amestecând-o cu un mineral. A denumit noua substanţă,
asemănătoare unui aluat,dinamită. Intenţia lui Nobel era ca această invenţie să
prevină accidentele mortale din domeniul ingineriei, însă, când lumea a intrat în
război, dinamita a fost utilizată pentru a ucide şi distruge.
Pentru a compensa pierderile provocate de invenţia sa, Nobel şi-a folosit averea
pentru a fonda Premiile Nobel. Acestea sunt decernate oamenilor care aduc
contribuţii remarcabile în domeniul chimiei, fizicii, medicinei, literaturii,
economiei şi păcii.
Unele lucruri sunt inventate în acelaşi timp, în locuri diferite. În 1879,
americanul Thomas Edison şi englezul Joseph Swuan au inventat simultan
becul electric.
Se spune că primele monede au apărut în China antică. Ele erau făcute din
bronz, fiind proiectate pentru a arăta, ca uneltele cotidiene, cum sunt cuţitele şi
spadele.
În regatul antic al Lydiei, monedele rotunde au fost utilizate în anii 600 î.Hr. În
onoarea regelui aveau ştanţate pe o parte un leu şi un taur. Semnele de pe verso
indicau greutatea şi calitatea lor. Cu trecerea timpului, comerţul a înflorit, iar
odată cu el şi banii. Se presupune că banii din hârtie îşi au originile tot în China
antică. Bancnotele de hârtie au fost emise pentru prima dată în 1661, de către
banca din Stockholm, în Suedia.
În 1988, oamenii de ştiinţă din Australia au inventat bancnotele de plastic care
sunt de patru ori mai rezistente fiind în acelaşi timp şi reciclabile.
În 1642, la numai 19 ani, Blaise Pascal, a construit un aparat aritmetic
simplu pentru tatăl său, a cărui slujbă implica număratul banilor. Aparatul
folosea un mecanism de ceasornic pentru a aduna sau scădea automat (numere
cu până la opt zecimale).
Câţiva ani mai târziu, un mare matematician, Gottfried Leibnitz, a dezvoltat
aparatul lui Pascal, realizând un model care făcea adunări, scăderi, înmulţiri şi
împărţiri şi extrăgea rădăcina pătrată a numerelor. Acesta a servit ca prototip
pentru toate calculatoarele, finalmente şi pentru computere.
Unele dintre denumirile noilor invenţii medicale sunt la fel de complicate ca
şi cele ale bolilor ce le diagnostichează. Tomografia Axială Computerizată
(TAC) converteşte imaginile radiografice în imagini video la rezoluţie înaltă.
Aceste scanări por arăta chiar şi micile diferenţe dintre ţesutul normal şi cel
anormal.
Rezonanţa Magnetică Nucleară Imagistică (RMNI) a fost inventată în Anglia şi
Statele Unite în 1973. Prin 1981, scanerele RMNI, care utilizau undele radio
pentru a produce imagini în secţiune transversală a ţesutului moale, puteau face
fotografii tridimensionale în interiorul corpului.
DETALII TEHNICE
Website-ul INOVARE SI PROGRES este construit cu ajutorul limbajelor
HTML ( Hypertext Markup Language ) si CSS ( Cascade Style Sheet ).
HTML este un limbaj simplu, de marcaj, care se foloseste de etichete sau
tags.
CSS nu este un limbaj in sine, ci un mecanism care permite formatarea
documentului HTML.CSS nu exclude HTML-ul din pagina web, el doar vine
pe langa acesta pentru a conferi anumite proprietati, pentru a face totul mai
atractiv si mai bine organizat.
Programele folosite pentru a realiza proiectul sunt urmatoarele :
➢ Adobe Dreamweaver CS5

➢ Adobe Photoshop CS5
Partea de programare a fost facuta cu Adobe Dreamweaver CS5.Am ales

acest editor HTML datorita profesionalismului in care este structurat, uneltelor
de care dispune, usurintei cu care se lucreaza in el si nu in ultimul rand pentru
ca posed o licenta.
Partea de design am creat-o cu ajutorul programului Adobe Photoshop CS5,
incontestabil cel mai profesional program din categoria editoarelor de
imagini.Dispune de nenumarate unelte de manipulare a imaginilor care
usureaza lucrul, nenumarate font-uri, gradient-uri si brush-uri, care ajuta enorm
orice designer.
Un utilizator care foloseste anumite versiune mai vechi de browsere, in
special Internet Explorer <7, poate intampina probleme in afisarea corecta a
paginii, datorita incompatibilitatilor intre CSS si browser.Acesta problema
poate fi rezolvata daca se folosesc ultimele versiuni ale Google Chrome sau
Mozilla Firefox.
STRUCTURA
Website-ul INOVARE SI PROGRES este alcatuit din 37 de pagini .html si
1 pagina .css.Are o structura simpla, familiara cu utilizatorul.
In partea de sus, gasim headerul, creat in Adobe Photoshop CS5.
In partea dreapta, langa header, se afla titlul proiectului, care face parte
practic din header.
Imediat sub header gasim meniu de navigatie.Meniul dispune de urmatoarele
butoane de navigatie :
➢ HOME – Reprezinta pagina de start a site-ului, index.html, unde gasim

informatii despre atestat..
➢ DE CE INVENTAM? - Titlul butonului este sugestiv, aici o sa gasim
cateva explicatii ca raspuns la aceasta intrebare logica.
➢ ISTORIE – Pe aceasta pagina o sa gasim o scurta istorie a inventicii,
civilizatii care au dominat din punct de vedere cultural, social si militar lumea.
➢ CIVILIZATII – Acest buton contine alte patru sub-butoane denumite dupa
cum urmeaza : CHINA, EGIPT, GRECIA ANTICA, ROMA ANTICA.Ele
contin informatii despre fiecare civilizatie in parte.
➢ PERSONALITATI – La fel ca anteriorul, acest buton contine mai multe
sub-butoane.Aceste sub-butoane reprezinta cate o era tehnologica in care s-a
aflat omenirea.La randul lor acestea se ramifica in butoane destinate unei
personalitati care a marcat istoria prin inventii si descoperiri.
➢ IN VIITOR – Meniul se termina cu acest buton, intitulat “In viitor”, pagina
unde imi exprim parerea persoanala si ideile despre viitorul inventicii.
COD SURSA
Prezint codul sursa al paginii index.html si style.css, codurile sursa a
celorlalte pagini este aproximativ acelasi.
COD SURSA index.html :
<html>

<head>
<title>Inovare si Progres</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="header"></div>
<br>

<style>
ul.Menu ul{display:none}
ul.Menu li:hover>ul{display:block}
ul.Menu ul{position: absolute;left:-1px;top:98%;}
ul.Menu ul ul{position: absolute;left:98%;top:-2px;}
ul.Menu,ul.Menu ul {
margin:0px;
list-style:none;
padding:0px 2px 2px 0px;
background-color:#fff;
background-repeat:repeat;
border-color:#808080;
border-width:1px;
border-style:solid;
}
ul.Menu table {border-collapse:collapse}ul.Menu {
display:block;
zoom:1;
height:21px;
float:left;
}
ul.Menu ul{
width:137.55px;
}
ul.Menu li{
display:block;
margin:2px 0px 0px 2px;
font-size:0px;
}
ul.Menu a:active, ul.Menu a:focus {
outline-style:none;
}
ul.Menu a, ul.Menu li.dis a:hover, ul.Menu li.sep a:hover {
display:block;
vertical-align:middle;
background-color:#FFFFFF;
border-width:1px;
border-color:#fff;
border-style:solid;
text-align:center;
text-decoration:none;
_padding-left:0;
font:normal 11px Tahoma;
color: #000;
cursor:default;
}
ul.Menu span{
overflow:hidden;
}
ul.Menu li {
float:left;
}
ul.Menu ul li {
float:none;
}
ul.Menu ul a {
text-align:left;
white-space:nowrap;
}
ul.Menu li.sep{
text-align:left;
padding:0px;
line-height:0;
height:100%;
}
ul.Menu li.sep span{
float:none; padding-right:0;
width:3px;
height:100%;
display:inline-block;
background-color:#808080; background-image:none;}
ul.Menu ul li.sep span{
width:100%;
height:3px;
}
ul.Menu li:hover{
position:relative;
}
ul.Menu li:hover>a{
background-color:#DBF0F9;
border-color:#45ADE4;
border-style:solid;
color: #444;
}
ul.Menu li a:hover{
position:relative;
background-color:#DBF0F9;
border-color:#45ADE4;
border-style:solid;
color: #444;
}
ul.Menu li.dis a {
color: #557D4F !important;
}
ul.Menu img {border: none;float:left;_float:none;margin-right:2px;width:16px;
height:16px;
}
ul.Menu ul img {width:16px;
height:16px;
}
ul.Menu img.over{display:none}
ul.Menu li.dis a:hover img.over{display:none !important}
ul.Menu li.dis a:hover img.def {display:inline !important}
ul.Menu li:hover > a img.def {display:none}
ul.Menu li:hover > a img.over {display:inline}
ul.Menu a:hover img.over,ul.Menu a:hover ul img.def,ul.Menu a:hover a:hover
ul img.def,ul.Menu a:hover a:hover img.over,ul.Menu a:hover a:hover a:hover
img.over{display:inline}
ul.Menu a:hover img.def,ul.Menu a:hover ul img.over,ul.Menu a:hover a:hover
ul img.over,ul.Menu a:hover a:hover img.def,ul.Menu a:hover a:hover a:hover
img.def{display:none}
ul.Menu a:hover ul,ul.Menu a:hover a:hover ul{display:block}
ul.Menu a:hover ul ul{display:none}
ul.Menu span{
display:block;
background-image:url(./images/arrv_white.gif);
background-position:right center;
background-repeat: no-repeat;
padding-right:9px;}
ul.Menu ul span{background-image:url(./images/arr_black.gif)}
ul.Menu ul li:hover > a span{ background-
image:url(./images/arr_white.gif);}
ul.Menu table a:hover span,ul.Menu table a:hover a:hover span{background-
image:url(./images/arr_white.gif)}
ul.Menu table a:hover table span{background-
image:url(./images/arr_black.gif)}
ul.Menu li.Menui0 {
width:110px;
height:23px;
}
ul.Menu li a.Menui0{
height:100%;
background-image:url(./images/btn3.jpg);
border-width:0px;
color:#fff;
}
ul.Menu li a.Menui0:hover{
background-image:url(./images/btn4.jpg);
color:#eee;
}
ul.Menum0 {
background-color:transparent;
border-width:0px;
}
ul.Menum0>li>a {
}
ul.Menum0 a {
}
ul.Menum0 ul a {
}
ul.Menum0>li {
}
ul.Menum0 li {
}
ul.Menum0 li li {
}
</style>



<ul class="Menu Menum0">
<li class="Menui0"><a class="Menui0"
href="index.html">HOME</a></li>
<li class="Menui0"><a class="Menui0" href="dece.html">DE CE
INVENTAM?</a></li>
href="istorie.html">ISTORIE</a></li>
href="#"><span>CIVILIZATII</span><![if gt IE 6]></a><![endif]>
<ul class="Menum">
<li class="Menui"><a class="Menui"
href="china.html">CHINA</a></li>
href="egipt.html">EGIPT</a></li>
<li class="Menui"><a class="Menui" href="grecia.html">GRECIA
ANTICA</a></li>
<li class="Menui"><a class="Menui" href="roma.html">ROMA
ANTICA</a></li>
</ul>
</li>
href="#"><span>PERSONALITATI</span><![if gt IE 6]></a><![endif]>
<ul class="Menum">
href="#"><span>ANTICHITATE</span><![if gt IE 6]></a><![endif]>
<ul class="Menum">
href="imhotep.html">Imhotep</a></li>
href="arhimede.html">Arhimede</a></li>
</ul>
</li>
href="#"><span>RENASTERE</span><![if gt IE 6]></a><![endif]>
<ul class="Menum">
href="davinci.html">Leonardo DaVinci</a></li>
href="copernic.html">Nicolaus Copernicus</a></li>
href="galilei.html">Galileo Galilei</a></li>
href="newton.html">Isaac Newton</a></li>
</ul>
</li>
<li class="Menui"><a class="Menui" href="#"><span>ERA
MODERNA</span><![if gt IE 6]></a><![endif]>
<ul class="Menum">
href="fahrenheit.html">Daniel Fahrenheit</a></li>
href="franklin.html">Benjamin Franklin</a></li>
href="watt.html">James Watt</a></li>
href="volta.html">Alessandro Volta</a></li>
href="darwin.html">Charles Darwin</a></li>
href="nobel.html">Alfred Nobel</a></li>
href="mendeleev.html">Dmitri Mendeleev</a></li>
<li class="Menui"><a class="Menui" href="benz.html">Karl
Benz</a></li>
</ul>
</li>
CONTEMPORANA</span><![if gt IE 6]></a><![endif]>
<ul class="Menum">
href="edison.html">Thomas Edison</a></li>
href="bell.html">Graham Bell</a></li>
href="tesla.html">Nikola Tesla</a></li>
href="diesel.html">Rudolf Diesel</a></li>
href="curie.html">Marie Curie</a></li>
href="wright.html">Wright Brothers</a></li>
href="paulescu.html">Nicolae Paulescu</a></li>
href="einstein.html">Albert Einstein</a></li>
href="fleming.html">Alexander Fleming</a></li>
<li class="Menui"><a class="Menui" href="baird.html">John
Logie Baird</a></li>
href="braun.html">Wernher von Braun</a></li>
href="palade.html">Emil Palade</a></li>
</ul>
</li>
INFORMATIONALA</span><![if gt IE 6]></a><![endif]>
<ul class="Menum">
href="lemelson.html">Jerome Hal Lemelson</a></li>
href="cooper.html">Martin Cooper</a></li>
href="berners.html">Tim Berners-Lee</a></li>
</ul>
</li>
</ul>
</li>
<li class="Menui0"><a class="Menui0" href="viitor.html">IN
VIITOR</a></li>
<li class="Menui0"><a class="Menui0" href="#">&nbsp</a></li>
</ul>

<br><br>
<table border="0" bordercolor="#000000">

<tr><td><img src="images/cosbuc.jpg"></td><td><b>NUME
:<br>PRENUME :<br>LICEU :<br>CLASA :<br>PROF.COORDONATOR
:</td><td><b>GIULVEZAN<br>MIHAI<br>COLEGIUL NATIONAL
"GEORGE COSBUC" NASAUD<br>XII-B<br>MARIUS LAZAR</b></td>
</tr>
</table>
<div id="footer">
Copyright © 2012 <a href="http://www.gcosbucnasaud.ro/"

target="_new">CNGC</a> | by <a href="http://www.facebook.com/MGNazy"
target="_new">Mihai Giulvezan</a>
</div>
</body>

</html>
Am considerat ca e mai eficient sa creez un fisier .css extern si sa nu includ

partea de css in fisierul html.
COD SURSA style.css :
/*
CSS File, All Rights Reserved to CNGC
*/
body {
margin: 0;
padding: 0;
color: #9c9893;
font-family: Tahoma, Geneva, sans-serif;
line-height: 1.7em;
background-image: url(Images/Background.jpg);
background-repeat: repeat-y;
background-position: top
}
a, a:link, a:visited { color: #FFF; font-weight: normal; text-decoration:

underline; font-size: 12px }
a:hover { text-decoration: none; }
#header {
width: 988px;
height: 160px;
border-top-style:solid;
border-color:transparent;
border-width:10px;
background: url(Images/Header.jpg) no-repeat top;
text-align: center;
display: block;
margin-left: auto;
margin-right: auto;
}
#footer {
clear: both;
width: 960px;
padding: 30px 14px 10px;
text-align: center;
color: #ccc;
position:absolute;
bottom:0;
width: 95%;
height:30px;
font-size:13px;
background: url(Footers/) repeat-x bottom;
}
BIBLIOGRAFIE
1.Cunostinte proprii despre tema aleasa
2.100 de Oameni de Stiinta si Inventatori Romani – Ed.Ion Creanga
3.www.wikipedia.com
4.www.w3schools.com
5.www.echoecho.com
6.www.toptenz.net
7.www.about.com

LICEU Atestat

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

LICEU Atestat

Încărcat de

Drepturi de autor:

Formate disponibile

LICEU

Despre HTML & CSS ..........................................4

Detalii tehnice .......................................................9

Cod Sursa ............................................................13

Există două tipuri de marcaje:

STRUCTURA UNUI DOCUMENT HTML

Un document HTML 4 are următoarea structură:

În principal, utilizarea imaginilor (pozelor) în cadrul paginilor HTML are

JPG - format introdus de JOINT PHOTOGRAPHIC EXPERT GROUP - este un

PNG - PORTABLE NETWORK GRAPHIC - este un format de compresie fără

alt - specifică un text alternativ pentru cazul în care imaginea nu poate fi

border - trasează un chenar în jurul imaginii;

width, height - specifică lăţimea, respectiv înălţimea imaginii. Nu sunt

hspace, vspace - specifică spaţiul care va fi păstrat în jurul unei imagini.

INSERAREA UNUI FORMULAR IN HTML

Formularele sunt introduse prin marcajul <form>...</form>.

CASCADE STYLE SHEET

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

➢ Adobe Dreamweaver CS5

Partea de programare a fost facuta cu Adobe Dreamweaver CS5.Am ales

➢ HOME – Reprezinta pagina de start a site-ului, index.html, unde gasim

COD SURSA index.html :

<table border="0" bordercolor="#000000">

Copyright © 2012 <a href="http://www.gcosbucnasaud.ro/"

Am considerat ca e mai eficient sa creez un fisier .css extern si sa nu includ

COD SURSA style.css :

a, a:link, a:visited { color: #FFF; font-weight: normal; text-decoration:

S-ar putea să vă placă și