Teste seu conhecimento 16
Publicado em: 2012-10-24 — 12.288 visualizacoes
DESAFIO ENCERRADO EM 09/11/2012.
Convido você a participar do desafio #16 do Maujor, mas não permita que o não cumprimento de regras do desafio invalide seu trabalho. 🙂.
Portanto leia com atenção este post do começo ao fim.
Sua missão, caso decida aceitá-la, é fazer com que a cor de fundo da janela de renderização mude quando o respectivo link para a cor é clicado, como mostrado na figura anterior. O não cumprimento de qualquer regra invalida o trabalho. Mas, não se estresse com isso, simplesmente leia as regras e as cumpra.
Afinal são apenas 3 regras.
As famigeradas regras
Atualização: A solução deverá ser sem uso de scripts. Somente HTML+CSS.
- O documento HTML a usar, obrigatoriamente, deve ser baixado neste link. Trata-se de um documento texto denominado Jose-da-Silva-Marques.html.txt. Retire a extensão .txt e renomeie com seu nome. Por exemplo: Bernard-de-Luna.html. Vou identificar o autor da solução pelo nome do arquivo, Assim se você nomear de forma diferente seu trabalho será descartado.
No documento há comentários orientando onde e o que você pode acrescentar e/ou codificar. - Envie o documento HTML sem zipar para maujor[AT]maujor[PT]com e no email de envio faça constar apenas o assunto do email que deverá ser o seguinte: desafio16. Se você não escrever isso seu email não irá para a caixa do desafio e eu não receberei. Envie somente uma solução e uma só vez.
- A renderização deverá ser em pelo menos um dos navegadores: Firefox/Chrome/Opera/Safari versão atual e para definir as cores CSS use as palavras-chaves: red, green e blue e se necessário transparent.
Estes desafios, como foram e serão todos os que estão por vir, são postados no blog com a finalidade única de proporcionar “divertimento” (para nerds né?) aos meus leitores e paralelamente fornece uma oportunidade para você exercitar seus conhecimentos. O valor prático do resultado do desafio não está em questão.
Notícias sobre o andamento do desafio, serão postadas no meu twitter. Se você não me segue no twitter acompanhe as atualizações subscrevendo o recebimento dos comentários, pois elas serão postadas ali.
Boa sorte e divirta-se. 😉
Sorteio de um livro do Maujor
Sortearei um dos meus 10 livros (link abre em nova janela), o sorteado escolhe, entre os leitores que enviarem a solução certa do desafio, até o dia 9 de novembro de 2012.
Desenvolvimento com Padrões Web? Adquira os livros do Maujor
Visite o site dos livros.
Esta matéria foi publicada em: 2012-10-24 (quarta-feira). Subscreva o feed RSS 2.0 para comentários.
Comentários e pings fechados.
Regras, por mais “babacas” que possam parecer, são para serem cumpridas.
Há razões para cada regra, que talvez escape ao seu entendimento.
Por exemplo: Você resolveu tudo certinho, mas nomeou seu arquivo de forma diferente das regras ou não colocou o texto do assunto conforme as regras ou etc…
O recebimento do email é automatizado e descarta no servidor o email em desacordo com as regras.
Não pergunte se recebi ou não seu email ou onde você errou, pois o encaminhamento de emails para análise da solução, como já foi dito, é automatizado.
Lamento muito se sua solução estava certa é um descuido seu levou seu email a ser descartado.
De toda forma agradeço muito sua participação.
Maujor,
A minha solução, você recebeu? Se recebeu, teve alguma coisa fora das regras?
Maujor,
Recebeu minha resposta do desafio? Se sim, poderia me dizer por qual motivo a minha solução não está correta?
Legal, acertei ! Tinha começado a fazer que nem o Fernando, mas achei a pseudo-classe :target. Valeu Maujor, e manda mais desafios ai, Abraços.
Valeu Maujor pela oportunidade de aprendizado e pelo livro! 😀
o/
Resultado do desafio:
Recebi 29 respostas ao desafio sendo 15 em desacordo com as regras e 14 respostas classificadas.
A finalidade deste desafio foi chamar a atenção para o uso da pseudo-classe :target prevista nas CSS4.
Das soluções enviadas 13 foram com uso dessa pseudo-classe e 1 solução, a do leitor Fabrício Matte merece destaque, por ter sido inédita em não ter usado a pseudo-classe.
O leitor sorteado com o livro foi o Fernando Daciuk .
As soluções podem ser consultadas em: respostas certas ao desafio 16 do Maujor.
Obrigado a todos os participantes.
Maujor, depois de finalizado o desafio tu pode publicar as respostas enviadas ?
Queria ver como a galera resolveu esse desafio.
Maujor,
concordo com vc,
só que essa observação de eventos é para js e nao html e css.
@Igor Qualquer cor
@Matheus sim e sim
@Rafael classe é um atributo (leia as regras)
@Anderson clicar é diferente de mousedown
clicou muda a cor, ao largar o botao volta para o normal,
ou clicou, apos largar o botao, mantem a cor?
Posso adicionar classes nos elementos né?
É para utilizar apenas css para este desafio? Javascript está descartado?
A cor de fundo da janela de renderização INICIAL (antes de qualquer um dos links serem clicados) pode ser qualquer uma? branco? qual?
@Reinaldo
Não!
Posso alterar a ordem dos elementos HTML?
Por exemplo inverter de
a
a
a
div
div
div
Para
div
div
div
a
a
a