Curso Superior de Tecnologia em Design GráficoDWEB - Design paraWeb                                              D        ...
DWEB - Design para Web / Carlos José                                                 Contato                              ...
DWEB - Design para Web / Carlos José                                                Objetivo da Aulan Apresentar   os asp...
DWEB - Design para Web / Carlos José                                               Agendan Elementos de blocon Elementos...
DWEB - Design para Web / Carlos José                                         Comportamento do Elementos HTML/XHTMLn    El...
DWEB - Design para Web / Carlos José                                       Comportamento do Elementos HTML/XHTMLn    Elem...
DWEB - Design para Web / Carlos José                              Comportamento do Elementos HTML/XHTMLn    Observações  ...
DWEB - Design para Web / Carlos José                              Comportamento do Elementos HTML/XHTMLn    Observações  ...
DWEB - Design para Web / Carlos José                                               Perguntas                              ...
DWEB - Design para Web / Carlos José                                                  Considerações FinaisFonte: Silva, Ma...
Upcoming SlideShare
Loading in...5
×

Unb 2012.1 - dweb - d - comportamento dos elementos

189

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
189
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Unb 2012.1 - dweb - d - comportamento dos elementos

  1. 1. Curso Superior de Tecnologia em Design GráficoDWEB - Design paraWeb D Comportamento dos elementos “E o Verbo se fez carne, e habitou entre nós, e vimos a sua glória, como a glória do unigênito do Pai, cheio de graça e de verdade.” João 1:141 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  2. 2. DWEB - Design para Web / Carlos José Contato Carlos José carlosjose.unibratec@gmail.com www.carlosjose.net twitter.com/carlosjoser2n2 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  3. 3. DWEB - Design para Web / Carlos José Objetivo da Aulan Apresentar os aspectos semânticos, das tag’s do HTML/XHTML em relação ao seu comportamento.3 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  4. 4. DWEB - Design para Web / Carlos José Agendan Elementos de blocon Elementos de linha4 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  5. 5. DWEB - Design para Web / Carlos José Comportamento do Elementos HTML/XHTMLn  Elementos de bloco î  Os browsers tratam os elementos de bloco como se estivessem em pequenas caixas retangulares, empilhadas na página. î  Cada elemento de bloco começa em uma nova linha, e normalmente possuem algum espaço acima e abaixo de todo o elemento. Descrição   Tag’s   Títulos   h1,  h2,  h3,  h4,  h5,  h6   Parágrafos   p   Citações  longas   blockquote   Texto  pré-­‐formatado   pre   Diversos  elementos  de  lista   ol,  ul,  li,  dl,  dt,  dd   Endereço  de  contato   address   Linha  horizontal   hr   Tabela     table,  tbody,  thead,  Moot,  tr,  td,  th   Divisão  em  um  elemento  de  bloco  genérico   div  5 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  6. 6. DWEB - Design para Web / Carlos José Comportamento do Elementos HTML/XHTMLn  Elementos de linha î  São aqueles que ocupam somente sua largura necessária e não possuem algum espaço acima e abaixo de todo o elemento. Descrição   Tag’s   Abreviação   abbr   Sigla   acronym   Citação;  uma  referência  a  outro  documento,   cite   como  o  Stulo  de  um  livro   Amostra  de  código  de  programa   code   Texto  enfaUzado   em   Citação  curta   q   Texto  fortemente  enfaUzado   strong   Elemento  de  linha  genérico   span  6 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  7. 7. DWEB - Design para Web / Carlos José Comportamento do Elementos HTML/XHTMLn  Observações î  Primeiro: n  Saber diferenciar elementos de bloco de linha é fundamental na marcação de documentos HTML/XHTML. n  A importância se deve pelo fato da restrição de uso de um elemento de bloco dentro de um elemento de linha. n  Exemplo: î  Nunca se deve colocar a tag <p> entre a tag <a></a>, ou seja, pôr um parágrafo dentro de um link. î  Segundo: n  Elementos de bloco e de linha se comportam de forma diferente quando recebem uma regra de formatação por meio da CSS. 7 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  8. 8. DWEB - Design para Web / Carlos José Comportamento do Elementos HTML/XHTMLn  Observações î  Terceiro: n  O elemento <div> é usado para identificar uma divisão de bloco dentro do documento HTML/XHTML. n  Esta divisão será usada como um contêiner envolto de um agrupamento lógico de elementos no documento. î  Sempre use a propriedade id para identificar de forma descritiva a <div> que contém os elementos relacionados gerando assim um contexto e uma estruturação. î  Quarto: n  O elemento <span> oferece as mesmas vantagens que o elemento <div>, exceto que ele é usado normalmente para elementos de linha. n  Como o elemento <span> é um elemento de linha, ele só pode conter texto e outros elementos de linha.8 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  9. 9. DWEB - Design para Web / Carlos José Perguntas ?9 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  10. 10. DWEB - Design para Web / Carlos José Considerações FinaisFonte: Silva, Maurício Samy., HTML 5: A linguagem de marcação do futuro, São Paulo, Novatec Brasil,julho 2011; ROBBINS, Jennifer Niederst. Aprendendo Web Design – guia para iniciantes, 3ª Edição;http://www.htmldog.com/; http://www.w3schools.com10 Apêndice D - Comportamento dos elementos Tuesday, 10 de April de 12
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×