INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.

P
CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Ficha Formativa
Tcnico de Informtica e Sistemas | UFCD: 0793
Nome Formando: _____________________

Data: __/__/__

Formador: Joo Leito

1. Crie um ficheiro com o nome index.html com as seguintes indicaes:

A. Ttulo (h1) com o seu nome, ao centro, tipo de letra: fantasy, com
tamanho 40px e com uma cor a seu gosto.

B. Pargrafo com a indicao do nome do curso, local e UFCDs leccionadas.

Dever formatar o pargrafo com tamanho de letra 20, cor a seu gosto,
tipo de letra: serif e justificado.
C. Ttulo (h2) com a data actual: cursive, com tamanho 24, sublinhado e com
uma cor a seu gosto.

2. Crie um ficheiro CSS com o nome style.css com as configuraes que definiu
para cada elemento no exerccio anterior.
Exemplo: Para os h1 a formatao dever ser o alinhamento ao centro,
tipo de letra: fantasy, com tamanho 40px e com uma cor a seu gosto.
3. Crie um documento HTML igual ao criado no ponto 1 com o nome
indexcss.html em que dever fazer a ligao ao ficheiro css e no dever ter
nenhuma formatao no prprio cdigo HTML (a formatao carregada pelo
css).
A estrutura de pastas e ficheiros dever ser a seguinte:
Ficha 1
- index.html
- indexcss.html
style
-style.css

As palavras a negrito so pastas

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Ficha Formativa
Tcnico de Informtica e Sistemas | UFCD: 0793
Nome Formando: _____________________

Data: __/__/__

Formador: Joo Leito

1. Crie um site no weebly com o nome TesteCSS NOMEFORMANDO com um tema

a seu gosto
2. Altere o ficheiro css para suportar:
a. h5: times new roman, vermelho, negrito com tamanho 24px
3. Crie as seguintes pginas:
a. HOME (Ttulo + elementos a seu gosto)
b. A EMPRESA (Ttulo + texto)
c. GALERIA (3 imagens)
d. RECURSOS (pdf + zip)
e. TESTECSS (h5 a demonstrar que o css funciona)

4. Exporte o seu site de modo a que este fique a funcionar em:

http://localhost/sites/testecss

5. Remova qualquer publicidade nas suas pginas e acrescente:

Teste CSS NOME FORMANDO

6. Altere a estrutura de pastas para que fique a funcionar com a nova estrutura:
Uploads (eliminar)
Ficheiros
Imagens
Outros

- zip
- pdf
- outros

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Ficha Formativa
Tcnico de Informtica e Sistemas | UFCD: 0793
Nome Formando: _____________________

Data: __/__/__

Formador: Joo Leito

1. Crie uma pgina HTML com o seu nome utilizando o elemento h1. O nome do
ficheiro dever ser index.html
2. Altere o index anterior para que a formatao do elemento h1 seja feita
diretamente no cdigo HTML e passe a ter tamanho 18px cor a seu gosto.
3. Faa uma cpia do ficheiro anterior para o nome indexcss.html
4. Remova todas as formataes de HTML/CSS do index anterior

5. Crie um ficheiro css (dentro de uma pasta com o nome style) para suportar:
a. h5: times new roman, vermelho, negrito com tamanho 24px
6. Altere o ficheiro HTML indexcss.html de forma a que este possua um
elemento h5 e que prove a ligao ao ficheiro css anterior.

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Ficha Formativa
Tcnico de Informtica e Sistemas | UFCD: 0793
Nome Formando: _____________________

Data: __/__/__

Formador: Joo Leito

1. Crie um ficheiro com o nome ficha3.html com as seguintes indicaes:

A. Fundo da pgina a azul.
B. Ttulo (h4) com o texto: Ficha 3 e com as seguintes indicaes:
a. Alinhado direita
b. Tipo de letra: Serif
c. tamanho 80px
d. Vermelho.

C. Pargrafo (p) com o texto: Exemplo de um pargrafo. Exemplo de um

pargrafo. Exemplo de um pargrafo. Exemplo de um pargrafo. com as
seguintes indicaes:
a. Justificado
b. Tipo de letra: Verdana
c. Tamanho 20px
d. Verde.
D. Ttulo (h2) com o texto UFCD: 0793 Scripts CGI e Folhas de Estilo e
com as seguintes indicaes:
a. Centrado
b. tipo de letra: Georgia
c. tamanho 30px
d. Preto.
E. Imagem a seu gosto
a. Centrado
b. Largura: 250px
c. Altura: 300px
d. A localizao da imagem deve estar numa pasta parte com o nome
img
Exemplo:
2. Crie um ficheiro CSS com o nome style.css com as configuraes que definiu
para cada elemento no exerccio anterior. O ficheiro css deve estar numa
pasta com o nome Style.
3. Crie um documento HTML igual ao criado no ponto 1 com o nome
ficha3css.html em que dever fazer a ligao ao ficheiro css e no dever ter
nenhuma formatao no prprio cdigo HTML (a formatao carregada pelo
css).

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Ficha Formativa
Tcnico de Informtica e Sistemas | UFCD: 0793
Nome Formando: _____________________

Data: __/__/__

Formador: Joo Leito

1. Crie um site no weebly com o nome TesteCSS NOMEFORMANDO com um tema

a seu gosto
2. Altere o ficheiro css para suportar:
a. h5: times new roman, vermelho, negrito com tamanho 24px
3. Crie as seguintes pginas:
a. HOME (Ttulo do trabalho + logo IEFP)
b. A EMPRESA (Ttulo + texto)
c. GALERIA (3 imagens)
d. RECURSOS (pdf + zip)
e. TESTECSS (h5 a demonstrar que o css funciona)

4. Exporte o seu site de modo a que este fique a funcionar em:

http://localhost/sites/testecss

5. Remova qualquer publicidade nas suas pginas e acrescente:

Teste CSS NOME FORMANDO

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Ficha de Avaliao Sumativa

EFA Tecnolgico - Tcnico de Informtica e Sistemas
UFCD:0793 Scripts CGI e Folhas de Estilo
Durao: 120 minutos
Nome Formando: _______________________

Data: ___/___/___ Formador: Joo Leito

Classificao: ________________________________________________________________

Notas Gerais:
Esta prova de natureza prtica contm trs grupos e tem a durao de 120 minutos.
Utilize apenas caneta ou esferogrfica de tinta indelvel, azul ou preta.
No permitido o uso de corrector. Em caso de engano, deve riscar, de forma
inequvoca, aquilo que pretende que no seja classificado.
No permitido o uso de auxiliares.
As respostas ilegveis ou que no possam ser identificadas so classificadas com zero
pontos.
Rubrique no canto superior direito todas as folhas da prova.
Qualquer tentativa de cpia ser punida com a anulao da prova.
As cotaes dos itens encontram-se descritas no quadro seguinte:
Grupo

Grupo I

Grupo II

Questo

1.

Alnea

Cotao
(Pontos)

TOTAL

A.

B.

C.

D.

E.

F.

G.

1.

2.

3.

12

20

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Grupo I

1. Descompacte o ficheiro grupo1.zip e realize os procedimentos necessrios

para ter a seguinte estrutura (note que os ficheiros que no possui e que
esto na figura so para ser desenvolvidos no decorrer deste grupo):
teste0793

grupo1

a.html

a_css.html

style

img

style.css

x.jpg

Notas:

Crie os procedimentos necessrios para obter o esquema acima ilustrado.

As indicaes de cada ficheiro (HTML e CSS) encontram-se na pgina seguinte.

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Ficheiro a.html
A. Fundo da pgina: #E0FFFF
B. Ttulo principal, com o seguinte texto: NOME_FORMANDO, centrado, com
tipo de letra: Courier, sublinhado, a piscar com tamanho 50px e cor verde.
C. Ttulo tercirio, com o seguinte texto: Teste 0793 Scripts CGI e Folhas de
estilo, alinhado esquerda, com tipo de letra: Serif, negrito com tamanho
25px e cor vermelho.
D. Pargrafo com o seguinte texto Exemplo de um pargrafo vrias vezes
repetido em HTML. Exemplo de um pargrafo vrias vezes repetido em
HTML. Exemplo de um pargrafo vrias vezes repetido em HTML. Exemplo
de um pargrafo vrias vezes repetido em HTML. Exemplo de um
pargrafo vrias vezes repetido em HTML..
Dever formatar o pargrafo com tamanho de letra 18px, cor azul, tipo de
letra: monospace e justificado.
E. Imagem x.jpg com 864x576 (LxA) alinhada direita

Ficheiro a_css.html
F. Ligao ao ficheiro style.css com ttulo principal, tercirio e pargrafo
igual ao anterior sem formatao.

Ficheiro style.css
G. Formataes do ficheiro a.html

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Grupo II
1. Descompacte o ficheiro grupo2.zip de forma a ter a seguinte estrutura:
teste0793

grupo2

index.html

apps

grupo1

files

...

...

!
2. Altere o contedo do(s) ficheiro(s) CSS para que:
Imagem de Fundo: a.jpg (localizada na pasta Files/theme/novaimagem)
Aplique a mesma imagem de fundo se existirem vrias reas com imagens.
Retire a imagem da caneta do canto superior esquerdo.

Ttulos h5:
Centrado | Tamanho: 20px
Cor: azul | Sublinhado
Fonte: Garamond

Ttulos h6:
Alinhado direita | Tamanho: 30px
Cor: amarelo | Itlico
Fonte: Arial
3. Altere o que for necessrio para provar que os elementos anteriores esto
bem definidos.

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Ficha de Avaliao Sumativa

EFA Tecnolgico - Tcnico de Informtica e Sistemas
UFCD:0793 Scripts CGI e Folhas de Estilo
Durao: 120 minutos
Nome Formando: _______________________

Data: ___/___/___ Formador: Joo Leito

Classificao: ________________________________________________________________

Notas Gerais:
Esta prova de natureza prtica contm trs grupos e tem a durao de 120 minutos.
Utilize apenas caneta ou esferogrfica de tinta indelvel, azul ou preta.
No permitido o uso de corrector. Em caso de engano, deve riscar, de forma
inequvoca, aquilo que pretende que no seja classificado.
No permitido o uso de auxiliares.
As respostas ilegveis ou que no possam ser identificadas so classificadas com zero
pontos.
Rubrique no canto superior direito todas as folhas da prova.
Qualquer tentativa de cpia ser punida com a anulao da prova.
As cotaes dos itens encontram-se descritas no quadro seguinte:
Grupo

Grupo I

Questo

Alnea

Cotao
(Pontos)

TOTAL

1.

2.

3.

4.

5.

6.

7.

1
20

INSTITUTO DO EMPREGO E FORMAO PROFISSIONAL I.E.F.P

CENTRO EMPREGO E FORMAO PROFISSIONAL DE VORA

Grupo I
1. Exporte o seu site de modo a que este fique a funcionar em:
http://localhost/teste793fx
x representa o seu num. de aluno.
2. Remova qualquer publicidade nas suas pginas e acrescente:
Teste 793 - 2014 | Produzido por: NOME_FORMANDO
3. Altere a estrutura de pastas para que fique a funcionar com a nova estrutura
eliminando qualquer ficheiro duplicado que exista:
Uploads (eliminar)
Src793files
Objects
Img
Others
Pdf
Swf
Zip
Pages (esta pasta fica vazia)

4. Altere as imagens de headers das pginas 1, 2 e 3 para que a pgina 1 e 2

fiquem com a imagem pag1e2 e a pgina 3 fique com a imagem pag3.
5. Altere o ficheiro css para suportar:
a. h5: sans serif, 20px, azul, itlico
b. h6: serif, 10px, vermelho, negrito e sublinhado..
6. Adicione pgina index.html dois elementos (h5 e h6) por baixo do ficheiro
swf com os textos:
a. H5: Isto um H5
b. H6: Isto um H6
7. Adicione um elemento <p> na pgina index .html com a resposta seguinte
pergunta: Se cada pgina tivesse a sua formatao prpria de elementos
HTML qual a melhor soluo para a formatao de elementos?.