SlideShare uma empresa Scribd logo
1 de 12
Sistemas Operacionais
Aula Extra – HTML
Professor: Anderson Henrique
Como funciona a Construção de Sites Simples
Parte I
Utilizando a Linguagem HTML
Construindo nosso Primeiro Site
TAGS Principais
Salvando Documento e Visualizando
Formatações Simples
O que vamos aprender:
A linguagem de Marcação de Hipertexto é utilizada na
construção de websites;
A Sintaxe é simples, os comandos são identificados
pelos sinais de “< >”, podem ser fechados quando
usamos “</ >”.
Vamos praticar abrindo o “Notepad”, Bloco de Notas;
HTML
Abra o bloco de notas, Menu Iniciar no campo pesquisar
digite “Notepad”, execute o programa
Construindo nosso primeiro site
<HTML>
<HEAD>
<TITLE>
</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Este comando inicia nosso documento html
Este comando inicia o cabeçalho do site
Este comando inicia o título do site
Aqui você digita o título do site
Este comando fecha o título do site
Este comando fecha o cabeçalho do site
Este comando inicia o corpo do site
Aqui você insere todo o conteúdo do site, tudo o que
for inserido aqui aparecerá no navegador
Este comando fecha o corpo do site
Este comando fecha nosso documento html
Após digitar esses códigos, vá no menu “Arquivo”,
selecione a opção “Salvar Como...”
Salvando e Visualizando
Após abrir essa caixa
de diálogo, escolha
o local onde deseja
salvar o documento,
e nomeie o
documento com
“index.html”, de
preferência o salve
em uma pasta com o
seu nome. Index.html
Meu exemplo
Página será visualizada assim
Comando TITLE
Comando BODY
<BR> - QUEBRA DE LINHA
<P> - PARÁGRAFO
<HR> - LINHA NA HORIZONTAL
<B> - NEGRITO
<U> - SUBLINHADO
<I> - ITÁLICO
<FONT SIZE> - TAMANHO DA FONTE
<FONT COLOR> - COR DA FONTE
<FONT FACE> - TIPO DE FONTE
Formatação Simples
Construir um site simples utilizando a linguagem
HTML falando sobre você, quem é você, o que gosta
de fazer, onde estuda, onde mora, qual a carreira
profissional que você pretende seguir;
Salvar este site, sentando em dupla deve conter
informações sobre os 02 alunos;
Atividade

Mais conteúdo relacionado

Mais procurados

Tutorial Sobre Flogs
Tutorial Sobre FlogsTutorial Sobre Flogs
Tutorial Sobre Flogs
neuza
 
Como Criar os Fóruns de Atividades no E-Proinfo
Como Criar os Fóruns de Atividades no E-ProinfoComo Criar os Fóruns de Atividades no E-Proinfo
Como Criar os Fóruns de Atividades no E-Proinfo
richard_romancini
 
Como criar a sua Conta Master na WCM777
Como criar a sua Conta Master na WCM777Como criar a sua Conta Master na WCM777
Como criar a sua Conta Master na WCM777
Dinho Garcia
 

Mais procurados (20)

Como bloquear portas de redes no windows
Como bloquear portas de redes no windows Como bloquear portas de redes no windows
Como bloquear portas de redes no windows
 
03874f
03874f03874f
03874f
 
Tuturial Html
Tuturial HtmlTuturial Html
Tuturial Html
 
Tutorial sobre-flogs-12848
Tutorial sobre-flogs-12848Tutorial sobre-flogs-12848
Tutorial sobre-flogs-12848
 
Tutorial Sobre Flogs
Tutorial Sobre FlogsTutorial Sobre Flogs
Tutorial Sobre Flogs
 
Como criar um Blog
Como criar um BlogComo criar um Blog
Como criar um Blog
 
Webdesign 02- HTML
Webdesign 02- HTMLWebdesign 02- HTML
Webdesign 02- HTML
 
Manual de configuração do outlook
Manual de configuração do outlookManual de configuração do outlook
Manual de configuração do outlook
 
Registro Forum
Registro ForumRegistro Forum
Registro Forum
 
Como Criar os Fóruns de Atividades no E-Proinfo
Como Criar os Fóruns de Atividades no E-ProinfoComo Criar os Fóruns de Atividades no E-Proinfo
Como Criar os Fóruns de Atividades no E-Proinfo
 
Introdução à informática
Introdução à informáticaIntrodução à informática
Introdução à informática
 
Criando Blog Ste
Criando Blog SteCriando Blog Ste
Criando Blog Ste
 
Ambiente web aula 02
Ambiente web   aula 02Ambiente web   aula 02
Ambiente web aula 02
 
Webdesign - Hmtl - Aula 01 - 2019-01
Webdesign - Hmtl - Aula 01 - 2019-01Webdesign - Hmtl - Aula 01 - 2019-01
Webdesign - Hmtl - Aula 01 - 2019-01
 
03874g
03874g03874g
03874g
 
Como Configurar E Mail
Como Configurar E MailComo Configurar E Mail
Como Configurar E Mail
 
Como criar a sua Conta Master na WCM777
Como criar a sua Conta Master na WCM777Como criar a sua Conta Master na WCM777
Como criar a sua Conta Master na WCM777
 
HTML (A linguagem)
HTML (A linguagem)HTML (A linguagem)
HTML (A linguagem)
 
Html - Iniciando a programação - Webdesign 2019-02 - Aula 2
Html - Iniciando a programação - Webdesign 2019-02 - Aula 2Html - Iniciando a programação - Webdesign 2019-02 - Aula 2
Html - Iniciando a programação - Webdesign 2019-02 - Aula 2
 
Css no webdesign
Css no webdesignCss no webdesign
Css no webdesign
 

Semelhante a Sistemas operacionais (extra)

Aula 02 e 03 estrutura básica parte 01 e 02
Aula 02 e 03 estrutura básica parte 01 e 02Aula 02 e 03 estrutura básica parte 01 e 02
Aula 02 e 03 estrutura básica parte 01 e 02
Jolvani Morgan
 
Webpages
WebpagesWebpages
Webpages
EMSNEWS
 
Apostila html,xhtml e css
Apostila html,xhtml e cssApostila html,xhtml e css
Apostila html,xhtml e css
mario_venancio
 

Semelhante a Sistemas operacionais (extra) (20)

Ambiente web (extra)
Ambiente web (extra)Ambiente web (extra)
Ambiente web (extra)
 
5098 html
5098 html5098 html
5098 html
 
5098 html
5098 html5098 html
5098 html
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
Html manual
Html manualHtml manual
Html manual
 
[Old] Curso de programação web dia 01
[Old] Curso de programação web dia 01[Old] Curso de programação web dia 01
[Old] Curso de programação web dia 01
 
Apostila de HTML para iniciantes
Apostila de HTML para iniciantesApostila de HTML para iniciantes
Apostila de HTML para iniciantes
 
Apostila html,xhtml e css
Apostila html,xhtml e cssApostila html,xhtml e css
Apostila html,xhtml e css
 
2 html,xhtml e css
2   html,xhtml e css2   html,xhtml e css
2 html,xhtml e css
 
Web design
Web designWeb design
Web design
 
Apostila html,xhtml e css
Apostila html,xhtml e cssApostila html,xhtml e css
Apostila html,xhtml e css
 
Html manual
Html manualHtml manual
Html manual
 
Aula 02 e 03 estrutura básica parte 01 e 02
Aula 02 e 03 estrutura básica parte 01 e 02Aula 02 e 03 estrutura básica parte 01 e 02
Aula 02 e 03 estrutura básica parte 01 e 02
 
T2Ti-ERP-3-Introducao-as-Tecnologias-Web.pdf
T2Ti-ERP-3-Introducao-as-Tecnologias-Web.pdfT2Ti-ERP-3-Introducao-as-Tecnologias-Web.pdf
T2Ti-ERP-3-Introducao-as-Tecnologias-Web.pdf
 
Webpages
WebpagesWebpages
Webpages
 
Webpages
WebpagesWebpages
Webpages
 
Apostila html,xhtml e css
Apostila html,xhtml e cssApostila html,xhtml e css
Apostila html,xhtml e css
 
Tele cine mozer
Tele cine mozerTele cine mozer
Tele cine mozer
 
Apostila+de+html
Apostila+de+htmlApostila+de+html
Apostila+de+html
 
Apostila HTML
Apostila HTMLApostila HTML
Apostila HTML
 

Mais de Anderson Henrique (20)

Sistemas operacionais aulas 14 e 15
Sistemas operacionais aulas 14 e 15Sistemas operacionais aulas 14 e 15
Sistemas operacionais aulas 14 e 15
 
Sistemas operacionais aula 13
Sistemas operacionais aula 13Sistemas operacionais aula 13
Sistemas operacionais aula 13
 
Sistemas operacionais aula 12
Sistemas operacionais aula 12Sistemas operacionais aula 12
Sistemas operacionais aula 12
 
Sistemas operacionais aula 11
Sistemas operacionais aula 11Sistemas operacionais aula 11
Sistemas operacionais aula 11
 
Sistemas operacionais aula 10
Sistemas operacionais aula 10Sistemas operacionais aula 10
Sistemas operacionais aula 10
 
Sistemas operacionais aula 09
Sistemas operacionais aula 09Sistemas operacionais aula 09
Sistemas operacionais aula 09
 
Sistemas operacionais Aula 08
Sistemas operacionais Aula 08Sistemas operacionais Aula 08
Sistemas operacionais Aula 08
 
Sistemas operacionais 07
Sistemas operacionais 07Sistemas operacionais 07
Sistemas operacionais 07
 
Sistemas operacionais 06
Sistemas operacionais 06Sistemas operacionais 06
Sistemas operacionais 06
 
Sistemas operacionais 05
Sistemas operacionais 05Sistemas operacionais 05
Sistemas operacionais 05
 
Sistemas operacionais 04
Sistemas operacionais 04Sistemas operacionais 04
Sistemas operacionais 04
 
Sistemas operacionais 03
Sistemas operacionais 03Sistemas operacionais 03
Sistemas operacionais 03
 
Sistemas Cadastro
Sistemas CadastroSistemas Cadastro
Sistemas Cadastro
 
Sistemas operacionais cadastro
Sistemas operacionais cadastroSistemas operacionais cadastro
Sistemas operacionais cadastro
 
Sistemas operacionais 02
Sistemas operacionais 02Sistemas operacionais 02
Sistemas operacionais 02
 
Sistemas operacionais
Sistemas operacionaisSistemas operacionais
Sistemas operacionais
 
Php04
Php04Php04
Php04
 
Php03
Php03Php03
Php03
 
Php02
Php02Php02
Php02
 
Php01
Php01Php01
Php01
 

Sistemas operacionais (extra)

  • 1. Sistemas Operacionais Aula Extra – HTML Professor: Anderson Henrique Como funciona a Construção de Sites Simples Parte I
  • 2. Utilizando a Linguagem HTML Construindo nosso Primeiro Site TAGS Principais Salvando Documento e Visualizando Formatações Simples O que vamos aprender:
  • 3. A linguagem de Marcação de Hipertexto é utilizada na construção de websites; A Sintaxe é simples, os comandos são identificados pelos sinais de “< >”, podem ser fechados quando usamos “</ >”. Vamos praticar abrindo o “Notepad”, Bloco de Notas; HTML
  • 4. Abra o bloco de notas, Menu Iniciar no campo pesquisar digite “Notepad”, execute o programa Construindo nosso primeiro site
  • 5. <HTML> <HEAD> <TITLE> </TITLE> </HEAD> <BODY> </BODY> </HTML> Este comando inicia nosso documento html Este comando inicia o cabeçalho do site Este comando inicia o título do site Aqui você digita o título do site Este comando fecha o título do site Este comando fecha o cabeçalho do site Este comando inicia o corpo do site Aqui você insere todo o conteúdo do site, tudo o que for inserido aqui aparecerá no navegador Este comando fecha o corpo do site Este comando fecha nosso documento html
  • 6. Após digitar esses códigos, vá no menu “Arquivo”, selecione a opção “Salvar Como...” Salvando e Visualizando
  • 7. Após abrir essa caixa de diálogo, escolha o local onde deseja salvar o documento, e nomeie o documento com “index.html”, de preferência o salve em uma pasta com o seu nome. Index.html
  • 9.
  • 10. Página será visualizada assim Comando TITLE Comando BODY
  • 11. <BR> - QUEBRA DE LINHA <P> - PARÁGRAFO <HR> - LINHA NA HORIZONTAL <B> - NEGRITO <U> - SUBLINHADO <I> - ITÁLICO <FONT SIZE> - TAMANHO DA FONTE <FONT COLOR> - COR DA FONTE <FONT FACE> - TIPO DE FONTE Formatação Simples
  • 12. Construir um site simples utilizando a linguagem HTML falando sobre você, quem é você, o que gosta de fazer, onde estuda, onde mora, qual a carreira profissional que você pretende seguir; Salvar este site, sentando em dupla deve conter informações sobre os 02 alunos; Atividade