Introduo Programao Apresentao

Document Sample
Introduo Programao Apresentao Powered By Docstoc
					Bruno C. de Paula


Laboratório de Informática
CSS Seletores
Texto em CSS




1º Semestre 2010 > PUCPR > BSI
Resumo da aula


Após finalizarmos nosso trabalho com os
seletores do CSS, é chegado o momento
de conhecer as principais propriedades
do CSS;
Nosso objetivo hoje será conhecer as
propriedades que lidam com textos.
Material referente ao assunto da aula

Tutorial sobre textos em CSS:
   http://www.maujor.com/tutorial/text
     tut.php
Textos em CSS interativo:
   http://imasters.uol.com.br/cssintera
     tivo/itext.php
Ferramenta para geração de texto
 sombreado:
   http://tools.westciv.com/shadows/index.ht
     ml

                                                3
Material referente ao assunto da aula


Recomendação W3C do CSS 2.1 (em
 Inglês):
  – http://www.w3.org/TR/CSS21/selecto
    r.html#pattern-matching
Capítulo do Livro CSS – Guia de Bolso:
  – http://altabooks.tempsite.ws/capitulo
    s_amostra/00_cssbolso.pdf


                                            4
Material referente ao assunto da
aula
               CSS – Guia de
                Bolso;
                – Editora AltaBooks;
                – 2008;
                – Download de um
                  capítulo.



                                       5
Tags HTML referenciadas na aula (em
Português –site Referenciando)

Tag de estilo: <style>;
Tag de link: <link>;
Tag de script: <script>.



                                      6
Tags HTML referenciadas na aula (em
Inglês – site SitePoint)

Tag de estilo: <style>;
Tag de link: <link>;
Tag de script: <script>;



                                      7
Propriedades CSS referenciados na aula
(em Inglês –site SitePoint)
letter-spacing: espaçamento das letras
 do texto;
word-spacing: espaçamento das
 palavras do texto;
line-height: altura das linhas;
text-align: alinhamento horizontal;
text-decoration: efeitos em texto;
text-indent: distanciamento da 1ª linha
 do texto.
                                           8
Propriedades CSS referenciados na
aula (em Inglês –site SitePoint)
text-transform: controla a capitalização
 do texto;
text-shadow: especifica o efeito de
 sombra em um texto;
vertical-align: alinhamento vertical;




                                            9
Propriedades CSS referenciados na aula
(em Inglês –site SitePoint)

white-space: controla o espaçamento
 em branco em um elemento;
direction: especifica a direção de
 escrita;




                                         10
Propriedades CSS referenciados na aula
(em Inglês –site SitePoint)

Específicos do IE e CSS3:
   writing-mode (CSS3/IE8): define a
    direção do texto;
   text-overflow (CSS3/IE6): permite
    aplicar (...) em um texto que não
    serve em um elemento.




                                         11
letter-spacing
Espaçamento entre letras




                           12
word-spacing
Espaçamento entre palavras




                             13
line-height
Altura das linhas
Pode ser usado para centralização de
 texto verticalmente;




                                        14
text-align
Alinhamento horizontal




                         15
text-decoration
Efeitos em texto
Suporte a blink limitado;




                             16
text-indent
Distanciamento da 1ª linha
 Pode-seusar valores negativos;
 % é em relação ao line-height;




                                   17
text-transform
Controla a capitalização do texto




                                    18
text-shadow
efeito de sombra
 Gerador de text-shadow.
 Emulador para IE / Firefox 3.0;
 text-shadow: h v b cor;
  h: deslocamento horizontal;
  v: descolamento vertical;
  b: blur (“borrado”).
 Pode-se aplicar mais de uma sombra
  separando por vírgulas.
                                       19
20
vertical-align
Alinhamento vertical




09/06/09               21
white-space
Tratamento do espaço em branco




09/06/09                         22
direction
especifica a direção de escrita




09/06/09                          23
writing-mode (IE8/CSS3)
Define a direção do texto

Disponível por completo só no IE8!




09/06/09                              24
text-overflow
Permite habilitar reticências (...)

Disponível a partir do IE6;
Emulador para Firefox;




09/06/09                              25
Exemplo text-overflow emulado




09/06/09                        26
Material referente ao assunto da aula

Tutorial sobre textos em CSS:
   http://www.maujor.com/tutorial/text
     tut.php
Textos em CSS interativo:
   http://imasters.uol.com.br/cssintera
     tivo/itext.php
Ferramenta para geração de texto
 sombreado:
   http://tools.westciv.com/shadows/index.ht
     ml

09/06/09                                        27
Material referente ao assunto da aula


Recomendação W3C do CSS 2.1 (em
 Inglês):
  – http://www.w3.org/TR/CSS21/selecto
    r.html#pattern-matching
Capítulo do Livro CSS – Guia de Bolso:
  – http://altabooks.tempsite.ws/capitulo
    s_amostra/00_cssbolso.pdf


09/06/09                                    28
Material referente ao assunto da
aula
               CSS – Guia de
                Bolso;
                – Editora AltaBooks;
                – 2008;
                – Download de um
                  capítulo.



09/06/09                               29

				
DOCUMENT INFO
Shared By:
Categories:
Tags:
Stats:
views:3
posted:9/10/2011
language:
pages:29