O documento descreve as principais novidades do HTML 5 e CSS 3, incluindo novos elementos estruturais como <header>, <section> e <nav> no HTML 5 e novos seletores como :matches() e :not() no CSS 4.
O documento descreve recursos de HTML5 e CSS3, incluindo novos elementos semânticos em HTML5 como <header> e <video>, e novos módulos em CSS3 como seletores, transições e transformações. Também fornece exemplos de como usar essas novas funcionalidades.
O documento discute a evolução das linguagens HTML e CSS desde 1991, destacando novas funcionalidades introduzidas no HTML5 e CSS3 como bordas redondas, sombras, múltiplos backgrounds e transformações 2D e 3D.
Slides da quarta aula do curso de HTML5 da Especializa. O curso está disponível gratuitamente no endereço: http://ead.especializa.com.br/curso/html5-basico
O documento discute a linguagem HTML5, incluindo suas principais características e como criar um site simples usando HTML e CSS. O documento fornece instruções passo a passo sobre estrutura básica de HTML, elementos semânticos do HTML5, estilização com CSS e desafio de criar um site de artista com imagem, lista de músicas e links.
O documento descreve as principais novidades do HTML5 e CSS3, incluindo a reorganização semântica do HTML5 com elementos como header, nav, section e article, assim como recursos multimídia como vídeo e canvas, e propriedades avançadas de CSS3 como borda arredondada, sombras e transições. Exemplos são fornecidos para ilustrar o uso desses recursos.
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Uni Buscapé Company
O documento discute os conceitos básicos de HTML, incluindo:
1) O que é HTML e como é usado para estruturar páginas da web;
2) As principais tags HTML como <head>, <body>, <h1>, <p>, <img>;
3) Como adicionar estilos a páginas HTML usando CSS.
O documento apresenta uma introdução a um treinamento sobre HTML5 e CSS3. Serão abordados uma breve história do HTML, a estrutura de um documento HTML5 e as novas possibilidades introduzidas pelo HTML5. Não haverá explicações detalhadas de código ou APIs ainda não implementadas pelos navegadores.
Curso de HTML5 com @zarathon
Aula01 - Introdução ao HTML
- Link para a video-aula : http://youtu.be/GL_ULlrwUMI
Inscrevam-se no canal para ficar sempre informado de quando sair um conteúdo novo!
Me sigam no twitter para mais informações: @zarathon
Dúvidas, críticas deixem nos comentários... Responderei a todos com muita satisfação!
O documento descreve recursos de HTML5 e CSS3, incluindo novos elementos semânticos em HTML5 como <header> e <video>, e novos módulos em CSS3 como seletores, transições e transformações. Também fornece exemplos de como usar essas novas funcionalidades.
O documento discute a evolução das linguagens HTML e CSS desde 1991, destacando novas funcionalidades introduzidas no HTML5 e CSS3 como bordas redondas, sombras, múltiplos backgrounds e transformações 2D e 3D.
Slides da quarta aula do curso de HTML5 da Especializa. O curso está disponível gratuitamente no endereço: http://ead.especializa.com.br/curso/html5-basico
O documento discute a linguagem HTML5, incluindo suas principais características e como criar um site simples usando HTML e CSS. O documento fornece instruções passo a passo sobre estrutura básica de HTML, elementos semânticos do HTML5, estilização com CSS e desafio de criar um site de artista com imagem, lista de músicas e links.
O documento descreve as principais novidades do HTML5 e CSS3, incluindo a reorganização semântica do HTML5 com elementos como header, nav, section e article, assim como recursos multimídia como vídeo e canvas, e propriedades avançadas de CSS3 como borda arredondada, sombras e transições. Exemplos são fornecidos para ilustrar o uso desses recursos.
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Uni Buscapé Company
O documento discute os conceitos básicos de HTML, incluindo:
1) O que é HTML e como é usado para estruturar páginas da web;
2) As principais tags HTML como <head>, <body>, <h1>, <p>, <img>;
3) Como adicionar estilos a páginas HTML usando CSS.
O documento apresenta uma introdução a um treinamento sobre HTML5 e CSS3. Serão abordados uma breve história do HTML, a estrutura de um documento HTML5 e as novas possibilidades introduzidas pelo HTML5. Não haverá explicações detalhadas de código ou APIs ainda não implementadas pelos navegadores.
Curso de HTML5 com @zarathon
Aula01 - Introdução ao HTML
- Link para a video-aula : http://youtu.be/GL_ULlrwUMI
Inscrevam-se no canal para ficar sempre informado de quando sair um conteúdo novo!
Me sigam no twitter para mais informações: @zarathon
Dúvidas, críticas deixem nos comentários... Responderei a todos com muita satisfação!
html, css e java script - renato araujoorenatoaraujo
Este documento fornece uma breve introdução sobre HTML, CSS e JavaScript. Apresenta os criadores e evolução das linguagens, características principais e boas práticas para seu uso. Sites de referência para aprendizado também são listados no final.
O documento apresenta uma aula sobre fundamentos de HTML5. Aborda tópicos como documentos HTML, marcações, estrutura básica de um documento HTML, novas tags semânticas do HTML5 como <header>, <nav> e <section>, elementos de texto como listas e citações, e modos e doctypes dos navegadores.
O documento apresenta um curso introdutório sobre HTML, definindo termos-chave como Internet, World Wide Web, páginas web, servidores web e navegadores. Explica o que é linguagem de marcação e HTML, além de conceitos como hipertexto, URLs e protocolos usados na web.
Este documento resume os principais conceitos de CSS ensinados até o momento, incluindo seletores, propriedades de dimensão, background, margem, espaçamento, bordas e overflow. Além disso, fornece exemplos de como aplicar estilos a elementos HTML como tabelas e formulários.
O documento resume uma aula sobre HTML e CSS, abordando seletores, propriedades de texto, cores, espaçamento, listas e posicionamento. É apresentado o conceito de sprites para imagens.
O documento apresenta os conceitos básicos de (X)HTML e CSS, incluindo estruturas básicas, tags, links, tabelas, formulários, cabeçalhos, cores, fontes, alinhamento, flutuação e posicionamento. Também discute assuntos extras como sprites CSS, SEO, acessibilidade e ferramentas de edição.
Este documento fornece informações sobre estilos em CSS (Cascading Style Sheets). Explica o que é CSS, como aplicar estilos através de folhas externas, seletores e propriedades. Também discute como especificar cores em CSS usando nomes predefinidos, valores hexadecimais, RGB e outros métodos.
1) O documento apresenta uma aula introdutória sobre HTML, definindo sua estrutura e principais elementos como cabeçalho, títulos, parágrafos, links, listas e tabelas. 2) É explicado que o HTML foi desenvolvido por Tim Berners-Lee em 1992 no CERN para permitir a troca de informações na web. 3) São mostrados exemplos básicos de código HTML para ilustrar o uso de elementos como cabeçalho, links, listas e tabelas.
O documento apresenta uma introdução sobre a estrutura HTML (DOM) e exemplos de como estruturar elementos em HTML, incluindo textos, listas, tabelas, formulários e outros. Também fornece uma introdução sobre a sintaxe e uso de CSS para formatação de páginas web, incluindo caixas de texto, fontes, modelos de caixa, bordas, posicionamento e backgrounds.
Este documento resume as principais propriedades CSS para formatação de texto, listas, posicionamento e compatibilidade entre navegadores. Também discute boas práticas de organização de código CSS como ordenação lógica de propriedades e uso de comentários.
O documento discute Cascading Style Sheets (CSS), que definem a aparência de páginas web. CSS permite aplicar estilos personalizados a elementos de forma flexível. Existem três formas de aplicar estilos: local (inline), incorporado (embedded) e externo (linked). A ordem de precedência é local > incorporado > externo.
O documento fornece uma introdução sobre como criar sites HTML. Explica que HTML é a linguagem subjacente usada por navegadores e foi inventada por Tim Berners-Lee em 1990. Também discute alguns softwares e editores de texto que podem ser usados para criar páginas HTML e que não é necessário estar online para desenvolver sites.
O documento apresenta uma aula introdutória sobre HTML, abordando suas principais tags e estrutura básica. É explicado o que é HTML e suas tags, como <html>, <head>, <title>, <body>, <h1>-<h6> para títulos, <p> para parágrafos, <br> para quebras de linha, <hr> para linhas horizontais, <ul> e <li> para listas não ordenadas, <ol> e <li> para listas ordenadas, <dl>, <dt> e <dd> para listas de definição e cores em HTML
O documento discute técnicas de CSS para estruturar e estilizar páginas web, incluindo:
1) Divisão de páginas em seções usando tags HTML como <div>;
2) Estilização de elementos como <h1>, <h2>, imagens e textos;
3) Uso de IDs e classes CSS para aplicar estilos específicos.
Vanessa Martinez Tonini apresenta um minicurso sobre CSS com as seguintes informações essenciais:
1) Apresenta sua experiência profissional e objetivos do minicurso de fornecer uma introdução básica à sintaxe e aplicação do CSS.
2) Explica o que é CSS, como funciona a cascata de estilos, e ferramentas para editar arquivos CSS.
3) Demonstra exemplos básicos de como aplicar estilos de fontes, cores, fundos, links, listas e tabelas usando CSS.
O documento introduz os conceitos básicos de CSS, incluindo sua finalidade de separar o conteúdo do estilo, suas especificações principais e como inserir folhas de estilo em documentos HTML. Ele também resume propriedades CSS comuns como plano de fundo, bordas, dimensões, texto, lista, margens e posicionamento.
O documento resume a história da World Wide Web e dos padrões web como HTML, XHTML e CSS. Explica as diferenças entre HTML e XHTML e os benefícios da semântica e validação. Também discute como vincular folhas de estilo e melhorar a acessibilidade.
O documento descreve as tags HTML para formatar texto, como <b>, <i>, <pre>, <blockquote>, <font> e <div>. Explica como usar essas tags para alterar estilos de fonte, tamanho, cor e alinhamento de texto. Também lista caracteres especiais que requerem códigos HTML como < e >.
O documento fornece diretrizes sobre padrões de desenvolvimento web para o site Globo.com, abordando tópicos como o uso de HTML semântico e valido, CSS, seletores, pseudo-classes e pseudo-elementos de forma a garantir acessibilidade, compatibilidade e desempenho.
html, css e java script - renato araujoorenatoaraujo
Este documento fornece uma breve introdução sobre HTML, CSS e JavaScript. Apresenta os criadores e evolução das linguagens, características principais e boas práticas para seu uso. Sites de referência para aprendizado também são listados no final.
O documento apresenta uma aula sobre fundamentos de HTML5. Aborda tópicos como documentos HTML, marcações, estrutura básica de um documento HTML, novas tags semânticas do HTML5 como <header>, <nav> e <section>, elementos de texto como listas e citações, e modos e doctypes dos navegadores.
O documento apresenta um curso introdutório sobre HTML, definindo termos-chave como Internet, World Wide Web, páginas web, servidores web e navegadores. Explica o que é linguagem de marcação e HTML, além de conceitos como hipertexto, URLs e protocolos usados na web.
Este documento resume os principais conceitos de CSS ensinados até o momento, incluindo seletores, propriedades de dimensão, background, margem, espaçamento, bordas e overflow. Além disso, fornece exemplos de como aplicar estilos a elementos HTML como tabelas e formulários.
O documento resume uma aula sobre HTML e CSS, abordando seletores, propriedades de texto, cores, espaçamento, listas e posicionamento. É apresentado o conceito de sprites para imagens.
O documento apresenta os conceitos básicos de (X)HTML e CSS, incluindo estruturas básicas, tags, links, tabelas, formulários, cabeçalhos, cores, fontes, alinhamento, flutuação e posicionamento. Também discute assuntos extras como sprites CSS, SEO, acessibilidade e ferramentas de edição.
Este documento fornece informações sobre estilos em CSS (Cascading Style Sheets). Explica o que é CSS, como aplicar estilos através de folhas externas, seletores e propriedades. Também discute como especificar cores em CSS usando nomes predefinidos, valores hexadecimais, RGB e outros métodos.
1) O documento apresenta uma aula introdutória sobre HTML, definindo sua estrutura e principais elementos como cabeçalho, títulos, parágrafos, links, listas e tabelas. 2) É explicado que o HTML foi desenvolvido por Tim Berners-Lee em 1992 no CERN para permitir a troca de informações na web. 3) São mostrados exemplos básicos de código HTML para ilustrar o uso de elementos como cabeçalho, links, listas e tabelas.
O documento apresenta uma introdução sobre a estrutura HTML (DOM) e exemplos de como estruturar elementos em HTML, incluindo textos, listas, tabelas, formulários e outros. Também fornece uma introdução sobre a sintaxe e uso de CSS para formatação de páginas web, incluindo caixas de texto, fontes, modelos de caixa, bordas, posicionamento e backgrounds.
Este documento resume as principais propriedades CSS para formatação de texto, listas, posicionamento e compatibilidade entre navegadores. Também discute boas práticas de organização de código CSS como ordenação lógica de propriedades e uso de comentários.
O documento discute Cascading Style Sheets (CSS), que definem a aparência de páginas web. CSS permite aplicar estilos personalizados a elementos de forma flexível. Existem três formas de aplicar estilos: local (inline), incorporado (embedded) e externo (linked). A ordem de precedência é local > incorporado > externo.
O documento fornece uma introdução sobre como criar sites HTML. Explica que HTML é a linguagem subjacente usada por navegadores e foi inventada por Tim Berners-Lee em 1990. Também discute alguns softwares e editores de texto que podem ser usados para criar páginas HTML e que não é necessário estar online para desenvolver sites.
O documento apresenta uma aula introdutória sobre HTML, abordando suas principais tags e estrutura básica. É explicado o que é HTML e suas tags, como <html>, <head>, <title>, <body>, <h1>-<h6> para títulos, <p> para parágrafos, <br> para quebras de linha, <hr> para linhas horizontais, <ul> e <li> para listas não ordenadas, <ol> e <li> para listas ordenadas, <dl>, <dt> e <dd> para listas de definição e cores em HTML
O documento discute técnicas de CSS para estruturar e estilizar páginas web, incluindo:
1) Divisão de páginas em seções usando tags HTML como <div>;
2) Estilização de elementos como <h1>, <h2>, imagens e textos;
3) Uso de IDs e classes CSS para aplicar estilos específicos.
Vanessa Martinez Tonini apresenta um minicurso sobre CSS com as seguintes informações essenciais:
1) Apresenta sua experiência profissional e objetivos do minicurso de fornecer uma introdução básica à sintaxe e aplicação do CSS.
2) Explica o que é CSS, como funciona a cascata de estilos, e ferramentas para editar arquivos CSS.
3) Demonstra exemplos básicos de como aplicar estilos de fontes, cores, fundos, links, listas e tabelas usando CSS.
O documento introduz os conceitos básicos de CSS, incluindo sua finalidade de separar o conteúdo do estilo, suas especificações principais e como inserir folhas de estilo em documentos HTML. Ele também resume propriedades CSS comuns como plano de fundo, bordas, dimensões, texto, lista, margens e posicionamento.
O documento resume a história da World Wide Web e dos padrões web como HTML, XHTML e CSS. Explica as diferenças entre HTML e XHTML e os benefícios da semântica e validação. Também discute como vincular folhas de estilo e melhorar a acessibilidade.
O documento descreve as tags HTML para formatar texto, como <b>, <i>, <pre>, <blockquote>, <font> e <div>. Explica como usar essas tags para alterar estilos de fonte, tamanho, cor e alinhamento de texto. Também lista caracteres especiais que requerem códigos HTML como < e >.
O documento fornece diretrizes sobre padrões de desenvolvimento web para o site Globo.com, abordando tópicos como o uso de HTML semântico e valido, CSS, seletores, pseudo-classes e pseudo-elementos de forma a garantir acessibilidade, compatibilidade e desempenho.
No dia 27 de março de 2013, das 10h15 às 11h30, eu apresentei a palestra "Suporte a padrões Web no Internet Explorer 10 e outros browsers, em múltiplas plataformas e em múltiplos dispositivos" no evento MVP Virtual Conference 2013.
Na palestra, eu mostrei o suporte a alguns dos principais recursos de HTML5, CSS3 e JavaScript nas versões mais recentes dos principais browsers (Internet Explorer, Chrome, Firefox, Safari e Opera), em múltiplas plataformas (Windows 8, Mac OS X Mountain Lion, Ubuntu Linux) e em múltiplos dispositivos (desktops, notebooks, ultrabooks, netbooks, smartphones e tablets).
Este documento apresenta os principais tópicos sobre HTML, CSS, DOM e LocalStorage. A primeira aula introduz o HTML, definindo-o como uma linguagem de marcação para criar páginas web semanticamente. A segunda aula aborda o CSS, que é usado para estilizar o layout e aspecto visual das páginas. A terceira aula explica como o DOM representa a estrutura do documento HTML e pode ser manipulado com JavaScript. Por fim, a quarta aula introduz o LocalStorage para armazenar dados no navegador.
O documento resume um minicurso sobre CSS, abordando conceitos como: 1) o que é CSS e como inseri-lo em uma página; 2) os principais seletores CSS e como estilizar elementos; 3) propriedades como medidas, dimensões, margens, padding e posicionamento. O curso também apresenta tópicos como elementos flutuantes, bordas, fontes, backgrounds e novidades do CSS3 como bordas arredondadas e sombras.
O documento discute a evolução da web para a Web 3.0, com foco nas novas tecnologias como HTML5, CSS3 e Javascript que permitem experiências web mais ricas e inteligentes, incluindo semântica melhorada, armazenamento no navegador, efeitos gráficos avançados e novas APIs. Essas tecnologias ainda não têm suporte completo, mas já permitem iniciar a construção da próxima geração da web.
O documento resume os principais conceitos e propriedades de CSS e jQuery. CSS é usado para definir a apresentação visual de páginas web, enquanto jQuery simplifica manipulação de elementos, eventos e interações. O documento inclui exemplos de como aplicar estilos de texto, fundo, caixas e posicionamento com CSS e como selecionar e manipular elementos com jQuery.
O documento resume uma palestra sobre HTML5, CSS3 e JavaScript que ocorrerá em 17 de outubro de 2022. Apresentará conceitos básicos dessas tecnologias como tags, elementos, estrutura básica de páginas web e exemplos de códigos.
O documento apresenta um minicurso sobre HTML, ensinando sobre as principais tags e estruturas do HTML, como <p>, <img>, <a>, <ul>, <ol>, <table>, além de novas tags semânticas do HTML5 como <header>, <nav> e <video>. O documento é dividido em seções ensinando sobre títulos, parágrafos, links, imagens, listas, formulários, elementos de bloco e linha, e por fim um projeto final para aplicar os conhecimentos.
1. O documento discute HTML5, apresentando sua história, arquitetura, elementos e semântica. Também aborda CSS3 e JavaScript.
2. São apresentados diversos elementos HTML5 como vídeo, áudio, listas e formulários, além de CSS como fontes, cores e bordas.
3. O documento fornece links e exemplos para auxiliar no aprendizado de HTML5, CSS3 e JavaScript.
Este documento fornece uma introdução aos padrões da Web, incluindo HTML. Explica a importância dos padrões para a produtividade e compatibilidade e apresenta as principais tags HTML como <html>, <head>, <body>, <p>, <img>, <a>, <table>, <form> e <div>.
O documento introduz os conceitos de Web Standards, CSS e Tableless. Resume que CSS é uma linguagem de definição de estilos usada para descrever a apresentação de documentos web e separar o conteúdo da apresentação. Tableless é uma filosofia que usa as tags HTML para seu significado semântico original.
Isto é uma apresentação sobre HTML5, a nova padrão web especificado pelo o W3C e WHAT-WG.
Nesta apresentação eu dou um curto resumo da historia de web apps e depois mostrar HTML5 usando varios exemplos.
Este documento fornece dicas para melhorar a performance de aplicações jQuery. Algumas dicas incluem evitar usar jQuery desnecessariamente, usar a versão mais recente para otimizações, compactar e minificar scripts, usar seletores mais eficientes e encadeamento. Testes de performance (benchmarks) são recomendados antes de fazer mudanças significativas.
O documento apresenta as novidades do HTML 5, incluindo novas tags para áudio, vídeo, gráficos e estrutura semântica, além de atualizações nos elementos de formulário e acessibilidade. É destacado o uso crescente do HTML 5 por desenvolvedores e exemplos de implementação de áudio, vídeo, canvas e SVG.
O documento descreve como HTML e CSS são usados juntos para estruturar e estilizar páginas da web. CSS é usado para definir como os elementos HTML são exibidos, enquanto HTML define o conteúdo da página. Folhas de estilo externas permitem alterar a aparência de todo um site editando um único arquivo CSS.
O documento apresenta uma introdução ao HTML e CSS, com uma linha do tempo histórica destas tecnologias e explicações sobre elementos estruturais e chaves como tags, seções head e body, listas e tabelas. É fornecido um guia sobre quais tags devem e não devem ser usadas atualmente.
O documento apresenta as principais diferenças entre HTML5 e XHTML, como a remoção do fechamento de tags, a nova sintaxe do doctype e a adição de novas tags semânticas. Também discute como implementar vídeos, tabelas e formulários semanticamente no HTML5, além de dicas para adaptação a dispositivos móveis.
Semelhante a Apresentação - HTML5 e CSS3 Fabrica do Design (20)
O documento descreve os desafios enfrentados por uma equipe de desenvolvimento em manter um portal imobiliário. Inicialmente o processo de deploy era lento e complexo, com resistência da equipe de infraestrutura. Posteriormente a equipe migrou para a AWS, adotou processos ágeis e deploy contínuo, melhorando a agilidade e permitindo a venda do portal.
This document outlines a release process for a project called Pense. It shows the master and hotfix branches used for releases, with versions 1.0.0, 1.0.5, and 2.0.0, 2.0.1 released from those branches. Feature branches are used for development and merged into dev or release branches when complete.
O documento descreve um sistema de recomendação de imóveis chamado PenseGraph. Ele usa um grafo de propriedades de usuários e imóveis para recomendar imóveis personalizados com base no perfil, gostos e preferências dos usuários. O sistema também mede o engajamento dos usuários com os imóveis para melhorar as recomendações futuras.
The document discusses setting up a private DNS server using Bind9 to separate development, testing, and production environments for domains like dev.company.com and prd.company.com. It notes that maintaining DNS resolution tables can be difficult. The Hoster tool is introduced as a way to more easily manage DNS records across different environments in a git-based and reusable way.
Hotspot Green and Blue Label - Switching the labels!Iuri Andreazza
1. O documento discute a ideia de "trocar rótulos" entre ambientes de produção e homologação para permitir a entrega contínua.
2. Isso permitiria que as equipes de desenvolvimento assumissem mais responsabilidades sobre o ambiente e automatizassem processos como implantação e configuração.
3. A abordagem proposta minimizaria gargalos no lançamento de novos recursos e permitiria uma evolução de tecnologia mais rápida e confiável.
Apresentacao Workshop da Fabrica do DesignIuri Andreazza
O documento descreve uma oficina de discussão (FDD Workshop) com o objetivo de apresentar novos projetos e ideias para colegas. A agenda inclui apresentações sem limites de tempo sobre qualquer tema escolhido, desde que expanda os limites do conhecimento dos participantes. O objetivo é estimular o pensamento criativo e o compartilhamento de conhecimento.
3. HTML 5
• Novos elementos estruturais
• <header>
• <section>
• <article>
• <footer>
• <nav>
<aside>
4. HTML 5
• Novos elementos estruturais
• <header>
• <section>
• <article>
• <footer>
• <nav>
<aside>
5. HTML 5
• Elementos de Conteúdo
• <figure> - Associa legenda a uma img, video, audio, obj, iframe
• <canvas> - render de imagens personalizado
• <audio> - usado para streaming
• <video> - usado para streaming
• <dialog> - junto ao dd, dt serve para criar uma rep. de diálogo
• <time> - representação de data e hora
• <meter> - utilizado para representar medidas
6. HTML 5
• Elementos de Conteúdo
• <figure>
• <figure id="figura01">
• <legend>Figura 1. Esquema de uma página em HTML5</legend>
• <img src="html5.png" border="0" width="200" height="300"
•
alt="Estrutura de uma página escrita com os novos elementos do HTML5" />
• </figure>
7. HTML 5
• Elementosde Conteúdo
• <canvas>
• Bibliotecas Javascript utilizam essa tag para renderizar imagens ou mesmo utilizar a API para
renderizar webGL.
• Ex.: treeJS, jCanvaScript, fabric.js, cakejs, doodle.js,
9. HTML 5
• Elementosde Conteúdo
• <dialog>
• <dialog>
• <dt> Olá! Tudo bem?
• <dd>Olá! Tudo certo e com você?
• <dt> Que bom!
• <dd> Como está sua familia?.
• <dt> Ah, tudo certo com eles, e com a sua?
• <dd> Tudo certo com a minha também!
• </dialog>
10. HTML 5
• Ganhou um logo!
• E tem elementos que indicam quais recursos estão sendo
usados na página.
• Todas as tags do HTML5 devem ser fechadas
• Doctype:
• <!DOCTYPE html>
• Elementos que deixaram de existir:
• <basefont>,<big>, <center>, <font>, <s>, <strike>, <tt>,
<u>, <frame>, <frameset> e <noframes>
11. HTML 5
• Ganhou um logo!
• E tem elementos que indicam quais recursos estão sendo
usados na página.
• Todas as tags do HTML5 devem ser fechadas
• Doctype:
• <!DOCTYPE html>
• Elementos que deixaram de existir:
• <basefont>,<big>, <center>, <font>, <s>, <strike>, <tt>,
<u>, <frame>, <frameset> e <noframes>
12. CSS 3
• Alguns elementos já conhecemos da nossa realidade
• alguns são novos ou nunca usamos.
• overflow-style: {auto|scrollbar|panner|move|marquee}
• Multi-collum layout:
• collumn-width : INT{px|inch|cm|em}
• collumn-gap: INT{px|inch|cm|em}
• collumn-rule: idem da config da borda
13. CSS 3
• CSS3Layout
body{ grid: “ a a a”
“ b c d” “
#head { flow: a }
#nav { flow: b }
#adv {flow: c }
#body { flow: d }
14. CSS 3
• Seletores
• s1 > s2 - s2 filho de s1
• s1 + s2 - s2 precede imediatamente por s1
• s1 ~ s2 - s2 precede de s1
• E:first-letter - primeira letra do elemento E
• E:firt-line - primeira linha do elemento E
• E:lang(fr) - elemento formatado para a linguagem FR ou
qq outra
• E:empty - elemento que não tem filhos nem conteudo
15. CSS 3
• Seletores
• E:only-of-type - unico filho do seu tipo
• E:only-child - unico filho
• E:last-of-type - ultimo de um tipo
• E:first-of-type - primeiro de um tipo
• E:last-child - ultimo filho
• E:first-child - primeiro filho
• E:nth-... (todos os outros seletores so que para o enésimo
elemento)
16. CSS 3
• Seletores
• E[attr
? ”val”]
• Aonde ? pode ser:
• ~ - aonde o atributo eh uma lista separada por espaço
• ^ - valor do atributo começa com o val
• $ - valor que termina exatamente como val
• * - comparação parcial de val no atributo
• | - aonde o atributo eh uma lista separada por hifens
18. PORQUE!
• Mesmo, com o CSS3 e o HTML 5 liberados
• Não temos browsers suportam
• Mas devemos ficar espertos e aprender ja as novas
tecnologias
• CSS4 e HTML 5.1 vem com novas especificações que
permitem muito mais
19. SELETORES CSS4
• $E >F
• Aonde selecionamos ($E) que contenham F
• $DIV UL.menu { ... }
• $H2 > A { ... }
• $UL > LI:only-child { ... }
• $DIV H2 ~ P { ... }
• :NOT(s1, s2)
• Seletor presente no CSS3, agora permite selecionar
• Não suporta os operadores +, ~, >
• *:not(DIV, P) { ... }
20. SELETORES CSS4
• E:matches(s1, s2) S
• Seleciona todos os elementos s1 e s2 que a regra contém
• DIV:matches(A,P)
• :matches(DIV,SPAN.foto) img { ... }
• input:matches(:focus, :hover) { ... }
• E[attr=”val” i ]
• o adicional nesse atributo i é o fato dele dizer insensitive
• A:local-link { ... }
• Seleciona os links que funcionam localmente (prop. pag.)
• A:not(:local-link) { ... }
• Todos os links que apontam para outras paginas.
21. SELETORES CSS4
• A:local-link(0) { ... }
• Seleciona os links que funcionam localmente (prop. dom.)
• A:not(:local-link(0)) { ... }
• Todos os links que apontam para outros domínios.
• E /attr/ F
• LABEL:matches(:hover, :focus) /for/ INPUT
• Seleciona o input quando seu estado for hover e focus
• O atributo F não precisa estar dentro de E e nem ser
irmão
•
22. HTML 5.1
• W3C ainda está começando a nova especificação
• Com a finalização do HTML 5, irá ser inserido novas
tendencias
• Mas ainda não tem nada!
• Somente uma idéia!
• hahahaha
Comentar sobre os atributos que foram retirados (porque o CSS pode reproduzir eles semant..):\ntarget no elemento <a>;\nalign nos elementos <table> e demais tags de tabelas, <iframe>, <img>, <input>, <hr>, <div>, <p>, entre outros;\nbackground em <body>;\nbgcolor nos elementos de tabela e no <body>;\nborder em <table> e <object>;\ncellpadding e cellspacing em <table>;\nheight em <td> e <th>;\nwidth nos elementos <hr>, <table>, <td>, <th> e <pre>;\nhspace e vspace em <img> e <object>;\nnoshade e size em <hr>.\n\n
\n
\n
\n
\n
\n
\n
\n
$ seleciona um elemento e verifica se tem as regras abaixo\n\n
$ seleciona um elemento e verifica se tem as regras abaixo\n\n
$ seleciona um elemento e verifica se tem as regras abaixo\n\n
$ seleciona um elemento e verifica se tem as regras abaixo\n\n