SlideShare uma empresa Scribd logo
1 de 20
Baixar para ler offline
Curso HTML & CSS
       > Herbet Ferreira Rodrigues
      > contato@herbetferreira.com
Sumário

> Introdução ao CSS
          O que é CSS?
      •

          CSS surgiu…
      •

          Proposta / Aplicação
      •


> Integrando CSS às Páginas
> Formatando com CSS
      • Classes
      • Alinhamento
      • Efeito de Texto
      • Estilos de Fontes
      • <Span>




                                 2
Introdução ao CSS
Introdução ao CSS

>O que é CSS?
        ”Cascading Style sheetsquot; ou quot;Folhas de
    •
        Estilo Encadeadas” é uma tecnologia
        (linguagem) criada para definir estilos
        (cores, tipologia, posicionamento, etc ...);

        CSS facilitam a criação, formatação e
    •
        manutenção de páginas Web.

        Pode ser algo do tipo: body { font-family:
    •
        Verdana; font-size: 10pt }


                                                       4
Introdução ao CSS

>CSS surgiu…
        Popularização da Web e alto custo de
    •
        manutenção para sites cada vez maiores e
        de layouts complexos.

        Projetos intranet e internet que exigindo
    •
        padronização de conteúdo.

        Foi criado no final de 1996 e, hoje o Style
    •
        Sheets está em sua segunda fase, a fase 2
        (maio/98).

                                                      5
Introdução ao CSS

>Proposta / Aplicação
        A linguagem HTML preocupa-se em estruturar a
    •
        página em blocos de informação (títulos,
        cabeçalhos, parágrafos, links, metatags, etc...)

        CSS controla o layout (design de estrutura, cores,
    •
        fontes )

        Consegue-se então separar o estilo do conteúdo
    •


        Boa solução para websites na internet, intranet e
    •
        extranet com alto volume de páginas e manutenção
        constante .



                                                             6
Integrando CSS às Páginas
Integrando CSS às Páginas

>Referenciando um arquivo externo
 <html>
 <head>
     <link rel=“stylesheet” href=“meuprimeiro.css”
 type=quot;text/cssquot;>
 <title>...</title>
 </head>
 <body>
 ...
 </body>
 </html>


                                                     8
Integrando CSS às Páginas

>Definindo dentro da tag <style>

  <html>
  <head>
  <style type=quot;text/cssquot;>
  <!--
      P { font-size: 10pt; font-family: quot;Verdana, Arialquot;; color:
  #000066 }
  -->
  </style>
  </head>
  ...


                                                                   9
Integrando CSS às Páginas
> Atributos de estilo inline em algumas tags HTML como
  <p>, <div>, ou <span>

   <div style=quot;margin-left: 1in; font-size: 9ptquot;>
   Este texto irá receber os estilos definidos na tag DIV ...
   <span style=quot;font-weight: bold; background: #FFFF00quot;>
   este texto aqui usa a tag span ...</span>
   </div>




                                                                10
Formatando com CSS
Formatanto com CSS

> Classes
        Uma classe poderá armazenar uma série
    •
        de propriedades que poderão ser
        utilizadas para diferentes partes da
        página HTML.

        Para isso, teremos que indicar um nome
    •
        para a classe para que, posteiormente,
        possamos utilizá-la.

        Esse nome desse ser especificado da
    •
        seguinte forma:

  .nome_da_classe { propriedades }
                                                 12
Formatanto com CSS

> Alinhamento
            Utilizando a propriedade {text-align: valor}
        •



  <style type=“text/css”>
    .direita { text-align: right }
    .esquerda { text-align: left }
    .central { text-align: center }
    .justificado { text-align: justify }
  </style>
  ...
  <p class=“nome_da_classe”>Texto</p>


                                                      13
Formatanto com CSS

> Efeitos de sublinha
         Utilizando a propriedade {text-decoration:
     •
         valor}

           •{   text-decoration: underline }
           •{   text-decoration: line-through }
           •{   text-decoration: none }
           •{   text-decoration: overline }




                                                  14
Formatanto com CSS

> Família de Fontes
        Utilizando a propriedade {font-family:
    •
        valores}

          •{font-family:   Verdana, Arial, Helvetica,
          sans-serif; }
          •{font-style:   Georgia, quot;Times New
          Romanquot;, Times, serif; }




                                                        15
Formatanto com CSS

> Tamanho de Fontes
        Utilizando a propriedade {font-size: valor}
    •



          •{font-size:   10pt; }
          •{font-size:   14px; }
          •{font-size:   20cm; }




                                                  16
Formatanto com CSS

> Estilo de Fontes
         Utilizando a propriedade {font-style: valor}
     •



           •{font-style:   oblique; }
           •{font-style:   italic; }
           •{font-style:   normal; }


           •{font-weight:    bold; }


                                                   17
Formatanto com CSS

> <Span> e </Span>
        A tag <span> e </span> é utilizada
    •
        para aplicar um alinhamento numa parte
        do texto, sem iniciar um parágrafo ou
        quebra de linha.
        É também muito utilizada para definir as
    •
        propriedades de folha de estilo,
        justamente por sua característica de não
        iniciar um novo parágrafo ou quebra de
        linha.
  <span class=“nome”>Texto</span>


  <p>Texto com <span style=“font-size:
  15px;”>tamanho maior</span>.</p>                 18
FIM

      19
Contato

> Nome: Herbet Ferreira Rodrigues

> E-mail: contato@herbetferreira.com

> Material para Download: http://www.herbetferreira.com




                                                    20

Mais conteúdo relacionado

Mais procurados

Curso de html - Introdução ao HTML
Curso de html -  Introdução ao HTMLCurso de html -  Introdução ao HTML
Curso de html - Introdução ao HTMLTales Augusto
 
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estruturaAula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estruturaAndré Constantino da Silva
 
HTML - Aula 01 - Estrutura básica e tags básicas no html
HTML - Aula 01 - Estrutura básica e tags básicas no htmlHTML - Aula 01 - Estrutura básica e tags básicas no html
HTML - Aula 01 - Estrutura básica e tags básicas no htmlTiago Luiz Ribeiro da Silva
 
Introdução ao HTML - Parte 1 - O que é?, Títulos, Texto Simples e Parágrafo
Introdução ao HTML - Parte 1 - O que é?, Títulos, Texto Simples e ParágrafoIntrodução ao HTML - Parte 1 - O que é?, Títulos, Texto Simples e Parágrafo
Introdução ao HTML - Parte 1 - O que é?, Títulos, Texto Simples e ParágrafoAlamo Saravali
 
WebDesign AULA 2: Introdução a HTML
WebDesign AULA 2: Introdução a HTMLWebDesign AULA 2: Introdução a HTML
WebDesign AULA 2: Introdução a HTMLDra. Camila Hamdan
 
HTML 5 A evolução do HTML 4 para o HTML 5
HTML 5 A evolução do HTML 4 para o HTML 5HTML 5 A evolução do HTML 4 para o HTML 5
HTML 5 A evolução do HTML 4 para o HTML 5ondazul
 
Apresentação HTML e CSS
Apresentação HTML e CSSApresentação HTML e CSS
Apresentação HTML e CSSledsifes
 
Curso de HTML5 - Aula 01
Curso de HTML5 - Aula 01   Curso de HTML5 - Aula 01
Curso de HTML5 - Aula 01 Léo Dias
 
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Uni Buscapé Company
 

Mais procurados (20)

Curso de html - Introdução ao HTML
Curso de html -  Introdução ao HTMLCurso de html -  Introdução ao HTML
Curso de html - Introdução ao HTML
 
HTML Básico
HTML BásicoHTML Básico
HTML Básico
 
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estruturaAula 2 – Introdução a HTML - conceitos básicos e estrutura
Aula 2 – Introdução a HTML - conceitos básicos e estrutura
 
Apostila curso xhtml css
Apostila curso xhtml cssApostila curso xhtml css
Apostila curso xhtml css
 
HTML - Aula 01 - Estrutura básica e tags básicas no html
HTML - Aula 01 - Estrutura básica e tags básicas no htmlHTML - Aula 01 - Estrutura básica e tags básicas no html
HTML - Aula 01 - Estrutura básica e tags básicas no html
 
Introdução ao HTML - Parte 1 - O que é?, Títulos, Texto Simples e Parágrafo
Introdução ao HTML - Parte 1 - O que é?, Títulos, Texto Simples e ParágrafoIntrodução ao HTML - Parte 1 - O que é?, Títulos, Texto Simples e Parágrafo
Introdução ao HTML - Parte 1 - O que é?, Títulos, Texto Simples e Parágrafo
 
HTML
HTMLHTML
HTML
 
HTML Formatando Textos
HTML Formatando TextosHTML Formatando Textos
HTML Formatando Textos
 
WebDesign AULA 2: Introdução a HTML
WebDesign AULA 2: Introdução a HTMLWebDesign AULA 2: Introdução a HTML
WebDesign AULA 2: Introdução a HTML
 
W3 c
W3 cW3 c
W3 c
 
Xhtml 2011 - atualizado
Xhtml   2011 - atualizadoXhtml   2011 - atualizado
Xhtml 2011 - atualizado
 
HTML 5 A evolução do HTML 4 para o HTML 5
HTML 5 A evolução do HTML 4 para o HTML 5HTML 5 A evolução do HTML 4 para o HTML 5
HTML 5 A evolução do HTML 4 para o HTML 5
 
Aula 09
Aula 09Aula 09
Aula 09
 
Apresentação HTML e CSS
Apresentação HTML e CSSApresentação HTML e CSS
Apresentação HTML e CSS
 
Curso de HTML5 - Aula 01
Curso de HTML5 - Aula 01   Curso de HTML5 - Aula 01
Curso de HTML5 - Aula 01
 
Html 5 e Css3
Html 5 e Css3Html 5 e Css3
Html 5 e Css3
 
Curso de Desenvolvimento Web - Módulo 01 - HTML
Curso de Desenvolvimento Web - Módulo 01 - HTMLCurso de Desenvolvimento Web - Módulo 01 - HTML
Curso de Desenvolvimento Web - Módulo 01 - HTML
 
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
 
Aula 07
Aula 07Aula 07
Aula 07
 
Aula 04
Aula 04Aula 04
Aula 04
 

Destaque

Apostila HTML
Apostila HTMLApostila HTML
Apostila HTMLjoaorvb
 
Oportunidades de Marketing para o Setor de Educação
Oportunidades de Marketing para o Setor de EducaçãoOportunidades de Marketing para o Setor de Educação
Oportunidades de Marketing para o Setor de EducaçãoCarlos Henrique Muller
 
UOL HOST: diplomacia por uma boa experiência
UOL HOST: diplomacia por uma boa experiênciaUOL HOST: diplomacia por uma boa experiência
UOL HOST: diplomacia por uma boa experiênciaÍris Jacomino
 
E-mail marketing e promoções: Tudo o que está faltando para você fazer dar ce...
E-mail marketing e promoções: Tudo o que está faltando para você fazer dar ce...E-mail marketing e promoções: Tudo o que está faltando para você fazer dar ce...
E-mail marketing e promoções: Tudo o que está faltando para você fazer dar ce...Impulso Digital
 
Quem Não é Encontrado Não Existe 2.0 - Carlos Henrique Muller
Quem Não é Encontrado Não Existe 2.0 - Carlos Henrique MullerQuem Não é Encontrado Não Existe 2.0 - Carlos Henrique Muller
Quem Não é Encontrado Não Existe 2.0 - Carlos Henrique MullerCarlos Henrique Muller
 
Apresentação Otimize Marketing Digital
Apresentação Otimize Marketing DigitalApresentação Otimize Marketing Digital
Apresentação Otimize Marketing DigitalFlávio Aquino Sabugo
 
Palestra XXI CONAD - Google e as Novas Formas de Publicidade para o Novo [e-C...
Palestra XXI CONAD - Google e as Novas Formas de Publicidade para o Novo [e-C...Palestra XXI CONAD - Google e as Novas Formas de Publicidade para o Novo [e-C...
Palestra XXI CONAD - Google e as Novas Formas de Publicidade para o Novo [e-C...Flávio Aquino Sabugo
 
Ebook - 5 Dicas para um Cartão de Visita de Sucesso!
Ebook - 5 Dicas para um Cartão de Visita de Sucesso!Ebook - 5 Dicas para um Cartão de Visita de Sucesso!
Ebook - 5 Dicas para um Cartão de Visita de Sucesso!Carlos Henrique Muller
 
Empreendedorismo para publicidade
Empreendedorismo para publicidadeEmpreendedorismo para publicidade
Empreendedorismo para publicidadeAoki Media
 

Destaque (20)

Apostila HTML
Apostila HTMLApostila HTML
Apostila HTML
 
Mysql
MysqlMysql
Mysql
 
Oportunidades de Marketing para o Setor de Educação
Oportunidades de Marketing para o Setor de EducaçãoOportunidades de Marketing para o Setor de Educação
Oportunidades de Marketing para o Setor de Educação
 
UOL HOST: diplomacia por uma boa experiência
UOL HOST: diplomacia por uma boa experiênciaUOL HOST: diplomacia por uma boa experiência
UOL HOST: diplomacia por uma boa experiência
 
E-mail marketing e promoções: Tudo o que está faltando para você fazer dar ce...
E-mail marketing e promoções: Tudo o que está faltando para você fazer dar ce...E-mail marketing e promoções: Tudo o que está faltando para você fazer dar ce...
E-mail marketing e promoções: Tudo o que está faltando para você fazer dar ce...
 
Quem Não é Encontrado Não Existe 2.0 - Carlos Henrique Muller
Quem Não é Encontrado Não Existe 2.0 - Carlos Henrique MullerQuem Não é Encontrado Não Existe 2.0 - Carlos Henrique Muller
Quem Não é Encontrado Não Existe 2.0 - Carlos Henrique Muller
 
Apoio1020 apostila html
Apoio1020 apostila htmlApoio1020 apostila html
Apoio1020 apostila html
 
Manual completo de_html 01
Manual completo de_html 01Manual completo de_html 01
Manual completo de_html 01
 
GingaHero
GingaHeroGingaHero
GingaHero
 
Interação (OpenGL)
Interação (OpenGL)Interação (OpenGL)
Interação (OpenGL)
 
Viewport (OpenGL)
Viewport (OpenGL)Viewport (OpenGL)
Viewport (OpenGL)
 
Cores
CoresCores
Cores
 
Apresentação Otimize Marketing Digital
Apresentação Otimize Marketing DigitalApresentação Otimize Marketing Digital
Apresentação Otimize Marketing Digital
 
Deda notes meditation
Deda notes   meditationDeda notes   meditation
Deda notes meditation
 
Jucelma
JucelmaJucelma
Jucelma
 
Palestra XXI CONAD - Google e as Novas Formas de Publicidade para o Novo [e-C...
Palestra XXI CONAD - Google e as Novas Formas de Publicidade para o Novo [e-C...Palestra XXI CONAD - Google e as Novas Formas de Publicidade para o Novo [e-C...
Palestra XXI CONAD - Google e as Novas Formas de Publicidade para o Novo [e-C...
 
Ebook - 5 Dicas para um Cartão de Visita de Sucesso!
Ebook - 5 Dicas para um Cartão de Visita de Sucesso!Ebook - 5 Dicas para um Cartão de Visita de Sucesso!
Ebook - 5 Dicas para um Cartão de Visita de Sucesso!
 
Apresentação Guia-se | AdWords
Apresentação Guia-se | AdWordsApresentação Guia-se | AdWords
Apresentação Guia-se | AdWords
 
Marketing Digital Imobiliário
Marketing Digital ImobiliárioMarketing Digital Imobiliário
Marketing Digital Imobiliário
 
Empreendedorismo para publicidade
Empreendedorismo para publicidadeEmpreendedorismo para publicidade
Empreendedorismo para publicidade
 

Semelhante a Curso HTML e CSS Part2 (20)

Css completo(2)
Css   completo(2)Css   completo(2)
Css completo(2)
 
Css completo(2)
Css   completo(2)Css   completo(2)
Css completo(2)
 
Curso de Desenvolvimento Web - Módulo 02 - CSS
Curso de Desenvolvimento Web - Módulo 02 - CSSCurso de Desenvolvimento Web - Módulo 02 - CSS
Curso de Desenvolvimento Web - Módulo 02 - CSS
 
Criando sites com estilos
Criando sites com estilosCriando sites com estilos
Criando sites com estilos
 
Super CSS
Super CSSSuper CSS
Super CSS
 
CSS
CSSCSS
CSS
 
RCOM 11ºAno - CSS
RCOM 11ºAno - CSSRCOM 11ºAno - CSS
RCOM 11ºAno - CSS
 
Básico em (X)HTML e CSS
Básico em (X)HTML e CSSBásico em (X)HTML e CSS
Básico em (X)HTML e CSS
 
Mini curso html5 slides
Mini curso html5   slidesMini curso html5   slides
Mini curso html5 slides
 
WDI - aula 07 - css com html
WDI - aula 07 - css com htmlWDI - aula 07 - css com html
WDI - aula 07 - css com html
 
Css e iFrames
Css e iFramesCss e iFrames
Css e iFrames
 
XHTML, CSS e Semântica
XHTML, CSS e SemânticaXHTML, CSS e Semântica
XHTML, CSS e Semântica
 
Css For Beginners
Css For BeginnersCss For Beginners
Css For Beginners
 
CSS for Beginners
CSS for BeginnersCSS for Beginners
CSS for Beginners
 
Fundamentos e Desenvolvimento de Interface Web com HTML5 & CSS3
Fundamentos e Desenvolvimento de Interface Web com HTML5 & CSS3 Fundamentos e Desenvolvimento de Interface Web com HTML5 & CSS3
Fundamentos e Desenvolvimento de Interface Web com HTML5 & CSS3
 
Aula 07 Css - Parte 1
Aula 07   Css - Parte 1Aula 07   Css - Parte 1
Aula 07 Css - Parte 1
 
CSS - Cansei de Ser Subestimado
CSS - Cansei de Ser SubestimadoCSS - Cansei de Ser Subestimado
CSS - Cansei de Ser Subestimado
 
Aw aula 04
Aw aula 04Aw aula 04
Aw aula 04
 
Slides Css3
Slides Css3 Slides Css3
Slides Css3
 
CSS Mastigado
CSS MastigadoCSS Mastigado
CSS Mastigado
 

Último

Sistema de Acompanhamento - Diário Online 2021.pdf
Sistema de Acompanhamento - Diário Online 2021.pdfSistema de Acompanhamento - Diário Online 2021.pdf
Sistema de Acompanhamento - Diário Online 2021.pdfAntonio Barros
 
O que é, de facto, a Educação de Infância
O que é, de facto, a Educação de InfânciaO que é, de facto, a Educação de Infância
O que é, de facto, a Educação de InfânciaHenrique Santos
 
Power Point sobre as etapas do Desenvolvimento infantil
Power Point sobre as etapas do Desenvolvimento infantilPower Point sobre as etapas do Desenvolvimento infantil
Power Point sobre as etapas do Desenvolvimento infantilMariaHelena293800
 
Slides Lição 8, Betel, Ordenança para confessar os pecados e perdoar as ofens...
Slides Lição 8, Betel, Ordenança para confessar os pecados e perdoar as ofens...Slides Lição 8, Betel, Ordenança para confessar os pecados e perdoar as ofens...
Slides Lição 8, Betel, Ordenança para confessar os pecados e perdoar as ofens...LuizHenriquedeAlmeid6
 
Livro infantil: A onda da raiva. pdf-crianças
Livro infantil: A onda da raiva. pdf-criançasLivro infantil: A onda da raiva. pdf-crianças
Livro infantil: A onda da raiva. pdf-criançasMonizeEvellin2
 
UFCD_9184_Saúde, nutrição, higiene, segurança, repouso e conforto da criança ...
UFCD_9184_Saúde, nutrição, higiene, segurança, repouso e conforto da criança ...UFCD_9184_Saúde, nutrição, higiene, segurança, repouso e conforto da criança ...
UFCD_9184_Saúde, nutrição, higiene, segurança, repouso e conforto da criança ...Manuais Formação
 
Meu corpo - Ruth Rocha e Anna Flora livro
Meu corpo - Ruth Rocha e Anna Flora livroMeu corpo - Ruth Rocha e Anna Flora livro
Meu corpo - Ruth Rocha e Anna Flora livroBrenda Fritz
 
Slide Licao 4 - 2T - 2024 - CPAD ADULTOS - Retangular.pptx
Slide Licao 4 - 2T - 2024 - CPAD ADULTOS - Retangular.pptxSlide Licao 4 - 2T - 2024 - CPAD ADULTOS - Retangular.pptx
Slide Licao 4 - 2T - 2024 - CPAD ADULTOS - Retangular.pptxsfwsoficial
 
As Mil Palavras Mais Usadas No Inglês (Robert de Aquino) (Z-Library).pdf
As Mil Palavras Mais Usadas No Inglês (Robert de Aquino) (Z-Library).pdfAs Mil Palavras Mais Usadas No Inglês (Robert de Aquino) (Z-Library).pdf
As Mil Palavras Mais Usadas No Inglês (Robert de Aquino) (Z-Library).pdfcarloseduardogonalve36
 
MARCHA HUMANA. UM ESTUDO SOBRE AS MARCHAS
MARCHA HUMANA. UM ESTUDO SOBRE AS MARCHASMARCHA HUMANA. UM ESTUDO SOBRE AS MARCHAS
MARCHA HUMANA. UM ESTUDO SOBRE AS MARCHASyan1305goncalves
 
Nós Propomos! Canil/Gatil na Sertã - Amigos dos Animais
Nós Propomos! Canil/Gatil na Sertã - Amigos dos AnimaisNós Propomos! Canil/Gatil na Sertã - Amigos dos Animais
Nós Propomos! Canil/Gatil na Sertã - Amigos dos AnimaisIlda Bicacro
 
bem estar animal em proteção integrada componente animal
bem estar animal em proteção integrada componente animalbem estar animal em proteção integrada componente animal
bem estar animal em proteção integrada componente animalcarlamgalves5
 
EBPAL_Serta_Caminhos do Lixo final 9ºD (1).pptx
EBPAL_Serta_Caminhos do Lixo final 9ºD (1).pptxEBPAL_Serta_Caminhos do Lixo final 9ºD (1).pptx
EBPAL_Serta_Caminhos do Lixo final 9ºD (1).pptxIlda Bicacro
 
Formação T.2 do Modulo I da Formação HTML & CSS
Formação T.2 do Modulo I da Formação HTML & CSSFormação T.2 do Modulo I da Formação HTML & CSS
Formação T.2 do Modulo I da Formação HTML & CSSPedroMatos469278
 
Multiplicação - Caça-número
Multiplicação - Caça-número Multiplicação - Caça-número
Multiplicação - Caça-número Mary Alvarenga
 
APOSTILA- COMPLETA De FILOSOFIA-DA-EDUCAÇÃO.pdf
APOSTILA- COMPLETA  De FILOSOFIA-DA-EDUCAÇÃO.pdfAPOSTILA- COMPLETA  De FILOSOFIA-DA-EDUCAÇÃO.pdf
APOSTILA- COMPLETA De FILOSOFIA-DA-EDUCAÇÃO.pdflbgsouza
 
"Nós Propomos! Mobilidade sustentável na Sertã"
"Nós Propomos! Mobilidade sustentável na Sertã""Nós Propomos! Mobilidade sustentável na Sertã"
"Nós Propomos! Mobilidade sustentável na Sertã"Ilda Bicacro
 
ATIVIDADE 2 - GQ - COMUNICAÇÃO EMPRESARIAL E NEGOCIAÇÃO - 52_2024
ATIVIDADE 2 - GQ - COMUNICAÇÃO EMPRESARIAL E NEGOCIAÇÃO - 52_2024ATIVIDADE 2 - GQ - COMUNICAÇÃO EMPRESARIAL E NEGOCIAÇÃO - 52_2024
ATIVIDADE 2 - GQ - COMUNICAÇÃO EMPRESARIAL E NEGOCIAÇÃO - 52_2024azulassessoria9
 
APH- Avaliação de cena , analise geral do ambiente e paciente.
APH- Avaliação de cena , analise geral do ambiente e paciente.APH- Avaliação de cena , analise geral do ambiente e paciente.
APH- Avaliação de cena , analise geral do ambiente e paciente.HandersonFabio
 

Último (20)

Sistema de Acompanhamento - Diário Online 2021.pdf
Sistema de Acompanhamento - Diário Online 2021.pdfSistema de Acompanhamento - Diário Online 2021.pdf
Sistema de Acompanhamento - Diário Online 2021.pdf
 
O que é, de facto, a Educação de Infância
O que é, de facto, a Educação de InfânciaO que é, de facto, a Educação de Infância
O que é, de facto, a Educação de Infância
 
Power Point sobre as etapas do Desenvolvimento infantil
Power Point sobre as etapas do Desenvolvimento infantilPower Point sobre as etapas do Desenvolvimento infantil
Power Point sobre as etapas do Desenvolvimento infantil
 
Slides Lição 8, Betel, Ordenança para confessar os pecados e perdoar as ofens...
Slides Lição 8, Betel, Ordenança para confessar os pecados e perdoar as ofens...Slides Lição 8, Betel, Ordenança para confessar os pecados e perdoar as ofens...
Slides Lição 8, Betel, Ordenança para confessar os pecados e perdoar as ofens...
 
Livro infantil: A onda da raiva. pdf-crianças
Livro infantil: A onda da raiva. pdf-criançasLivro infantil: A onda da raiva. pdf-crianças
Livro infantil: A onda da raiva. pdf-crianças
 
UFCD_9184_Saúde, nutrição, higiene, segurança, repouso e conforto da criança ...
UFCD_9184_Saúde, nutrição, higiene, segurança, repouso e conforto da criança ...UFCD_9184_Saúde, nutrição, higiene, segurança, repouso e conforto da criança ...
UFCD_9184_Saúde, nutrição, higiene, segurança, repouso e conforto da criança ...
 
Meu corpo - Ruth Rocha e Anna Flora livro
Meu corpo - Ruth Rocha e Anna Flora livroMeu corpo - Ruth Rocha e Anna Flora livro
Meu corpo - Ruth Rocha e Anna Flora livro
 
662938.pdf aula digital de educação básica
662938.pdf aula digital de educação básica662938.pdf aula digital de educação básica
662938.pdf aula digital de educação básica
 
Slide Licao 4 - 2T - 2024 - CPAD ADULTOS - Retangular.pptx
Slide Licao 4 - 2T - 2024 - CPAD ADULTOS - Retangular.pptxSlide Licao 4 - 2T - 2024 - CPAD ADULTOS - Retangular.pptx
Slide Licao 4 - 2T - 2024 - CPAD ADULTOS - Retangular.pptx
 
As Mil Palavras Mais Usadas No Inglês (Robert de Aquino) (Z-Library).pdf
As Mil Palavras Mais Usadas No Inglês (Robert de Aquino) (Z-Library).pdfAs Mil Palavras Mais Usadas No Inglês (Robert de Aquino) (Z-Library).pdf
As Mil Palavras Mais Usadas No Inglês (Robert de Aquino) (Z-Library).pdf
 
MARCHA HUMANA. UM ESTUDO SOBRE AS MARCHAS
MARCHA HUMANA. UM ESTUDO SOBRE AS MARCHASMARCHA HUMANA. UM ESTUDO SOBRE AS MARCHAS
MARCHA HUMANA. UM ESTUDO SOBRE AS MARCHAS
 
Nós Propomos! Canil/Gatil na Sertã - Amigos dos Animais
Nós Propomos! Canil/Gatil na Sertã - Amigos dos AnimaisNós Propomos! Canil/Gatil na Sertã - Amigos dos Animais
Nós Propomos! Canil/Gatil na Sertã - Amigos dos Animais
 
bem estar animal em proteção integrada componente animal
bem estar animal em proteção integrada componente animalbem estar animal em proteção integrada componente animal
bem estar animal em proteção integrada componente animal
 
EBPAL_Serta_Caminhos do Lixo final 9ºD (1).pptx
EBPAL_Serta_Caminhos do Lixo final 9ºD (1).pptxEBPAL_Serta_Caminhos do Lixo final 9ºD (1).pptx
EBPAL_Serta_Caminhos do Lixo final 9ºD (1).pptx
 
Formação T.2 do Modulo I da Formação HTML & CSS
Formação T.2 do Modulo I da Formação HTML & CSSFormação T.2 do Modulo I da Formação HTML & CSS
Formação T.2 do Modulo I da Formação HTML & CSS
 
Multiplicação - Caça-número
Multiplicação - Caça-número Multiplicação - Caça-número
Multiplicação - Caça-número
 
APOSTILA- COMPLETA De FILOSOFIA-DA-EDUCAÇÃO.pdf
APOSTILA- COMPLETA  De FILOSOFIA-DA-EDUCAÇÃO.pdfAPOSTILA- COMPLETA  De FILOSOFIA-DA-EDUCAÇÃO.pdf
APOSTILA- COMPLETA De FILOSOFIA-DA-EDUCAÇÃO.pdf
 
"Nós Propomos! Mobilidade sustentável na Sertã"
"Nós Propomos! Mobilidade sustentável na Sertã""Nós Propomos! Mobilidade sustentável na Sertã"
"Nós Propomos! Mobilidade sustentável na Sertã"
 
ATIVIDADE 2 - GQ - COMUNICAÇÃO EMPRESARIAL E NEGOCIAÇÃO - 52_2024
ATIVIDADE 2 - GQ - COMUNICAÇÃO EMPRESARIAL E NEGOCIAÇÃO - 52_2024ATIVIDADE 2 - GQ - COMUNICAÇÃO EMPRESARIAL E NEGOCIAÇÃO - 52_2024
ATIVIDADE 2 - GQ - COMUNICAÇÃO EMPRESARIAL E NEGOCIAÇÃO - 52_2024
 
APH- Avaliação de cena , analise geral do ambiente e paciente.
APH- Avaliação de cena , analise geral do ambiente e paciente.APH- Avaliação de cena , analise geral do ambiente e paciente.
APH- Avaliação de cena , analise geral do ambiente e paciente.
 

Curso HTML e CSS Part2

  • 1. Curso HTML & CSS > Herbet Ferreira Rodrigues > contato@herbetferreira.com
  • 2. Sumário > Introdução ao CSS O que é CSS? • CSS surgiu… • Proposta / Aplicação • > Integrando CSS às Páginas > Formatando com CSS • Classes • Alinhamento • Efeito de Texto • Estilos de Fontes • <Span> 2
  • 4. Introdução ao CSS >O que é CSS? ”Cascading Style sheetsquot; ou quot;Folhas de • Estilo Encadeadas” é uma tecnologia (linguagem) criada para definir estilos (cores, tipologia, posicionamento, etc ...); CSS facilitam a criação, formatação e • manutenção de páginas Web. Pode ser algo do tipo: body { font-family: • Verdana; font-size: 10pt } 4
  • 5. Introdução ao CSS >CSS surgiu… Popularização da Web e alto custo de • manutenção para sites cada vez maiores e de layouts complexos. Projetos intranet e internet que exigindo • padronização de conteúdo. Foi criado no final de 1996 e, hoje o Style • Sheets está em sua segunda fase, a fase 2 (maio/98). 5
  • 6. Introdução ao CSS >Proposta / Aplicação A linguagem HTML preocupa-se em estruturar a • página em blocos de informação (títulos, cabeçalhos, parágrafos, links, metatags, etc...) CSS controla o layout (design de estrutura, cores, • fontes ) Consegue-se então separar o estilo do conteúdo • Boa solução para websites na internet, intranet e • extranet com alto volume de páginas e manutenção constante . 6
  • 8. Integrando CSS às Páginas >Referenciando um arquivo externo <html> <head> <link rel=“stylesheet” href=“meuprimeiro.css” type=quot;text/cssquot;> <title>...</title> </head> <body> ... </body> </html> 8
  • 9. Integrando CSS às Páginas >Definindo dentro da tag <style> <html> <head> <style type=quot;text/cssquot;> <!-- P { font-size: 10pt; font-family: quot;Verdana, Arialquot;; color: #000066 } --> </style> </head> ... 9
  • 10. Integrando CSS às Páginas > Atributos de estilo inline em algumas tags HTML como <p>, <div>, ou <span> <div style=quot;margin-left: 1in; font-size: 9ptquot;> Este texto irá receber os estilos definidos na tag DIV ... <span style=quot;font-weight: bold; background: #FFFF00quot;> este texto aqui usa a tag span ...</span> </div> 10
  • 12. Formatanto com CSS > Classes Uma classe poderá armazenar uma série • de propriedades que poderão ser utilizadas para diferentes partes da página HTML. Para isso, teremos que indicar um nome • para a classe para que, posteiormente, possamos utilizá-la. Esse nome desse ser especificado da • seguinte forma: .nome_da_classe { propriedades } 12
  • 13. Formatanto com CSS > Alinhamento Utilizando a propriedade {text-align: valor} • <style type=“text/css”> .direita { text-align: right } .esquerda { text-align: left } .central { text-align: center } .justificado { text-align: justify } </style> ... <p class=“nome_da_classe”>Texto</p> 13
  • 14. Formatanto com CSS > Efeitos de sublinha Utilizando a propriedade {text-decoration: • valor} •{ text-decoration: underline } •{ text-decoration: line-through } •{ text-decoration: none } •{ text-decoration: overline } 14
  • 15. Formatanto com CSS > Família de Fontes Utilizando a propriedade {font-family: • valores} •{font-family: Verdana, Arial, Helvetica, sans-serif; } •{font-style: Georgia, quot;Times New Romanquot;, Times, serif; } 15
  • 16. Formatanto com CSS > Tamanho de Fontes Utilizando a propriedade {font-size: valor} • •{font-size: 10pt; } •{font-size: 14px; } •{font-size: 20cm; } 16
  • 17. Formatanto com CSS > Estilo de Fontes Utilizando a propriedade {font-style: valor} • •{font-style: oblique; } •{font-style: italic; } •{font-style: normal; } •{font-weight: bold; } 17
  • 18. Formatanto com CSS > <Span> e </Span> A tag <span> e </span> é utilizada • para aplicar um alinhamento numa parte do texto, sem iniciar um parágrafo ou quebra de linha. É também muito utilizada para definir as • propriedades de folha de estilo, justamente por sua característica de não iniciar um novo parágrafo ou quebra de linha. <span class=“nome”>Texto</span> <p>Texto com <span style=“font-size: 15px;”>tamanho maior</span>.</p> 18
  • 19. FIM 19
  • 20. Contato > Nome: Herbet Ferreira Rodrigues > E-mail: contato@herbetferreira.com > Material para Download: http://www.herbetferreira.com 20