Elementos Inline 
(X)HTML 
Professor Jolvani 
Aula 06 e 07
Elementos Inline(X)HTML 
 Nesta aula, vamos aprender o que são elementos Inline, o que são boxes inline 
 Na aula passada trabalhamos com as tags “hs” h1, h2 ... h6, parágrafos <p> e 
quebra de linha <br />. Lembre-se quando abrir uma tag trate de fechá-la. 
 Novos elementos do html, vamos copiar pois queremos aproveitar e colar o 
arquivo da última aula, alterando para aula04.html. 
 Revisão documento html + head + title + body – tags obrigatórias, lembre-se 
também que nos aprendemos a usar o primeiro atributo, o align... 
 Tanto as tags quanto os atributos são declarados em minúsculo. O atributo vem 
seguido do sinal de igual e o seu valor entre aspas duplas. E não simples, isso 
faz diferença para um documento xhtml. 
 Na aula passada falamos sobre marcação semântica ela diz que quando usamos 
uma tag exemplo h1 é de alta relevância quando usamos h3 sabe-se pela 
marcação semântica que esse título é de menor relevância que h1.
Elementos Inline(X)HTML 
 Apesar do browser estilizar (criar um estilo) de maneira tradicional dele, o 
html não é uma linguagem de estilização. A linguagem de estilização usada 
nesse curso será o CSS, lá na frente. 
 O html é uma linguagem de marcação de texto. Lembre-se do significado dela, 
Hyper Text Markup Language, então Markup Language é linguagem de 
marcação, o que significa isso, marcação semântica onde a gente vai usar os 
elementos da linguagem (h1, h3, p, br) em conformidade com seu significado. 
 Exemplo isso é um titulo então eu marco com esse elemento (h1)... 
 Isso é um sub-tíutlo então eu marco com esse elemento (h2)... 
 Isso é um parágrafo então eu marco com esse elemento ( )... 
 Partindo para aula de boxs inline, ou elementos inline....
Elementos Inline(X)HTML 
 Os elemento usados até agora são elementos em bloco (h1,h2... p), pois eles 
se separam, fazem uma divisão no texto... 
 Observe que quando foi usado h1 ele deu uma quebra de linha deixando o 
outro elemento mais distante dele. 
 As tags inline, são elementos que podem ser aplicadas dento da linha, inline pq 
eles permanecem na mesma linha, e tanto esses elementos em bloco como os 
elementos inline eles são considerados containers ou boxes ou blocos de 
conteúdos. Ou seja, contém um bloco retangular que pode conter outros boxes 
+ conteúdo. 
 Então boxs inline são elementos da marcação xhtml que não formam blocos 
separados de conteúdo, eles ficam em linha. 
 Elemento Bold, Negrito. <b> 
 Elemento Itálico, <i>
Elementos Inline(X)HTML 
 Algumas dessas tags estão depreciadas, ou seja, estão caindo em desuso. Quer 
dizer que elas estão sendo descontinuadas pela linguagem ex: <u> 
 Tag <u> = sublinhado, funciona mas esta sendo descontinuada... Ai passa-se a 
usar o CSS para sublinhar o texto. 
 Outras tags, <del> </del> marca que o texto vai ser excluído. 
 Texto com fonte mono espaçadas (tele tipo)... <tt> </tt> meramente para 
apresentação (Titulo de conhecimento) 
 Tegs mais interessantes: 
 Sub Escrito e sobre escrito 
 <sup> </sup> e <sub> </sub>
Elementos Inline(X)HTML 
 O html é uma forma de marcar o texto, então eu quero dar ênfase em uma 
determinada área. Uso a tag <em> apesar de ele colocar o texto em itálico o 
importante é entender que quando eu marco com <em> eu “aviso” o browser 
que é pra ele dar ênfase no texto que eu marquei... 
 Posso dar + ênfase ainda: uso <strong> </strong> 
 Citação usa-se <q> </q>; 
 Texto um pouco maior que o restante <big> </big> 
 Texto um pouco menor que o restante <small> </small> 
 Esses são elementos inline, eles não excutam nenhuma quebra de linha. 
 Teste o <blink>, essa tag nem existe mais... Vcs como profissionais não usarão 
essa tag, podem conseguir esse efeito com CSS 
 Também depreciada <marquee> </marquee> não usar titulo de curiosidade. 
 Últimas referência em www.w3c.org... W3schools.com
Próxima Aula: Cores

Aula 06 e 07 elementos inline parte01 e 02

  • 1.
    Elementos Inline (X)HTML Professor Jolvani Aula 06 e 07
  • 2.
    Elementos Inline(X)HTML Nesta aula, vamos aprender o que são elementos Inline, o que são boxes inline  Na aula passada trabalhamos com as tags “hs” h1, h2 ... h6, parágrafos <p> e quebra de linha <br />. Lembre-se quando abrir uma tag trate de fechá-la.  Novos elementos do html, vamos copiar pois queremos aproveitar e colar o arquivo da última aula, alterando para aula04.html.  Revisão documento html + head + title + body – tags obrigatórias, lembre-se também que nos aprendemos a usar o primeiro atributo, o align...  Tanto as tags quanto os atributos são declarados em minúsculo. O atributo vem seguido do sinal de igual e o seu valor entre aspas duplas. E não simples, isso faz diferença para um documento xhtml.  Na aula passada falamos sobre marcação semântica ela diz que quando usamos uma tag exemplo h1 é de alta relevância quando usamos h3 sabe-se pela marcação semântica que esse título é de menor relevância que h1.
  • 3.
    Elementos Inline(X)HTML Apesar do browser estilizar (criar um estilo) de maneira tradicional dele, o html não é uma linguagem de estilização. A linguagem de estilização usada nesse curso será o CSS, lá na frente.  O html é uma linguagem de marcação de texto. Lembre-se do significado dela, Hyper Text Markup Language, então Markup Language é linguagem de marcação, o que significa isso, marcação semântica onde a gente vai usar os elementos da linguagem (h1, h3, p, br) em conformidade com seu significado.  Exemplo isso é um titulo então eu marco com esse elemento (h1)...  Isso é um sub-tíutlo então eu marco com esse elemento (h2)...  Isso é um parágrafo então eu marco com esse elemento ( )...  Partindo para aula de boxs inline, ou elementos inline....
  • 4.
    Elementos Inline(X)HTML Os elemento usados até agora são elementos em bloco (h1,h2... p), pois eles se separam, fazem uma divisão no texto...  Observe que quando foi usado h1 ele deu uma quebra de linha deixando o outro elemento mais distante dele.  As tags inline, são elementos que podem ser aplicadas dento da linha, inline pq eles permanecem na mesma linha, e tanto esses elementos em bloco como os elementos inline eles são considerados containers ou boxes ou blocos de conteúdos. Ou seja, contém um bloco retangular que pode conter outros boxes + conteúdo.  Então boxs inline são elementos da marcação xhtml que não formam blocos separados de conteúdo, eles ficam em linha.  Elemento Bold, Negrito. <b>  Elemento Itálico, <i>
  • 5.
    Elementos Inline(X)HTML Algumas dessas tags estão depreciadas, ou seja, estão caindo em desuso. Quer dizer que elas estão sendo descontinuadas pela linguagem ex: <u>  Tag <u> = sublinhado, funciona mas esta sendo descontinuada... Ai passa-se a usar o CSS para sublinhar o texto.  Outras tags, <del> </del> marca que o texto vai ser excluído.  Texto com fonte mono espaçadas (tele tipo)... <tt> </tt> meramente para apresentação (Titulo de conhecimento)  Tegs mais interessantes:  Sub Escrito e sobre escrito  <sup> </sup> e <sub> </sub>
  • 6.
    Elementos Inline(X)HTML O html é uma forma de marcar o texto, então eu quero dar ênfase em uma determinada área. Uso a tag <em> apesar de ele colocar o texto em itálico o importante é entender que quando eu marco com <em> eu “aviso” o browser que é pra ele dar ênfase no texto que eu marquei...  Posso dar + ênfase ainda: uso <strong> </strong>  Citação usa-se <q> </q>;  Texto um pouco maior que o restante <big> </big>  Texto um pouco menor que o restante <small> </small>  Esses são elementos inline, eles não excutam nenhuma quebra de linha.  Teste o <blink>, essa tag nem existe mais... Vcs como profissionais não usarão essa tag, podem conseguir esse efeito com CSS  Também depreciada <marquee> </marquee> não usar titulo de curiosidade.  Últimas referência em www.w3c.org... W3schools.com
  • 7.