HTML5 Less Framework »

04mar 2010, às 09:12

Publicado em Framework HTML / CSS | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

Um poderoso html5 framework para construção de layouts inteligentes para sites com diferentes larguras de telas, essa é a premissa do Less Framework desenvolvido por Joni Korpi e distribuído sobre Creative Commons.

Less Framework é um framework (dã) CSS para construção de layouts para web multi-flexível. Ele contém uma grid de oito colunas otimizado para um line-height de 24px, bem como um conjunto de presets para tipografia com base no número de ouro que se encaixam em ritmo vertical da grid.

Less Framework funciona perfeitamente no Chrome, Safari 3.0+, Firefox 3.0+ e Internet Explores 7+. E se ajusta inteligentemente em uma única coluna em navegadores de dispositivos com tela pequena.

Galeria de sites em HTML5 »

24fev 2010, às 08:26

Publicado em HTML / CSS | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

HTML5 Gallery tem 2 objetivos principais, o primeiro deles é ser uma vitrine para sites que usam HTML5 para marcação da sua estrutura e compreender como as pessoas estão interpretando a nova especificação e como eles as implementaram. Isto leva ao segundo objetivo que é ajudar as pessoas a aprender HTML5 e como ela deve ser utilizada e implementada.

Os idealizador Richard Clark espera com este projeto que os desenvolvedores de navegadores vejam quantas pessoas estão implementando o HTML5 e que assim comecem a adicionar mais suporte em seus motores de renderização de modo que não precisemos mais usar css em elementos que não são realmente necessários e precisar confiar no javascript na criação de elementos.

Você pode seguir @html5gallery para receber atualizações sobre novos sites adicionas à galeria.

Visite os links a seguir e comece seus estudos em HTML5:

• Aprendendo HTML5
• HTML5

CSS3 - Border-radius / Cantos arredondados »

05dez 2009, às 08:08

Publicado em HTML / CSS | Deixe o seu comentário (1) »

publicado por: Magno Valdetaro

Com a CSS3 a W3C oferece algumas novas opções, das quais uma boa é a propriedade border-radius. O Mozilla Firefox e Safari 3+ já implementaram está função, que permite criar cantos arredondados: Veja um exemplo:

O código para este exemplo acima é bem simples:

Os cantos podem ser tratados de maneiras individuais e com formas diferente para os mozilla tem sua própria maneira de tratar está propriedade diferente do que é a especificação. No mozilla Firefox é tratado com -moz-border-radius-topright , já para os navegadores que utilizam o webkit como renderizador -webkit-border-top-right-radius:

Propriedades para cada canto no mozilla e webkit:

• -moz-border-radius-topleft / -webkit-border-top-left-radius
• -moz-border-radius-topright / -webkit-border-top-right-radius
• -moz-border-radius-bottomleft / -webkit-border-bottom-left-radius
• -moz-border-radius-bottomright / -webkit-border-bottom-right-radius

Transparência com CSS em todos os navegadores »

03dez 2009, às 07:09

Publicado em HTML / CSS | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

A transparência é um interessante e prático recurso da CSS e faz parte do grupo de propriedades que são tratadas completamente diferente dependendo do navegador. Para fazer com que cada navegador, interprete corretamente são necessárias 4 declarações CSS distintas. Que com a graça do nosso Senhor Jesus Cristo, amém, não interferem uma nas outras. Use como desejar, só cuidado para não gerar muita confusão, aqui vai um exemplo de transparência em 50%:

.transparência_class {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

Entenda o que é cada uma dessas propriedades CSS:

filter: alpha (opacity = 50); Está é própria para o IE.

-moz-opacity:0.5; Com está propriedade você dá suporte as versões antigas do Mozilla.

-khtml-opacity: 0.5; Está é a forma para as versões antigas do Safari (1.x), de quando o motor de redenrização que era usado ainda era referido como KTHML, diferente do webkit que é hoje. Mas continua funcionado nos navegadores Safari atuais.

opacity:0.5; Este é o mais importante, porque é o padrão atual no CSS. Está propriedade irá funcionar na maioria das versões do Firefox, Safari e Opera. Está seria a única propriedade necessária se todos os navegadores dessem suporte aos padrões atuais. Adivinha quem está no furo??

xCSS - Framework CSS orientado a objeto »

15out 2009, às 10:42

Publicado em Framework HTML / CSS Recursos | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

xCSS é um framework CSS que permite que você trabalhe orientado a objetos e mantenha um fluxo de trabalho simples no desenvolvimento de CSS complexas. Usar o xCSS reduz significativamente o tempo de desenvolvimento e te oferece: uma visão intuitiva da estrutura global da CSS, utilização de variáveis, reutilização e diversos outros recursos uteis. xCSS é leve e se integra a qualquer fluxo de trabalho e mantém seu HTML semântico.

Compatibilidades da CSS com Internet Explorer 6, 7 e 8 »

13out 2009, às 08:51

Publicado em HTML / CSS Recursos | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

Conhecer a compatibilidade da CSS tornou-se uma tarefa muito importante hoje em dia para webdesigners e desenvolvedores. A cada nova versão do Internet Explorer (arrepios) o suporte a CSS tem melhorado.

CSS3 Digest »

22set 2009, às 08:02

Publicado em HTML / CSS | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

HTML 5 Digest »

18set 2009, às 08:19

Publicado em HTML / CSS | Deixe o seu comentário (1) »

publicado por: Magno Valdetaro

Para começar a entender o HTML 5

• HTML 5 – brevíssima introdução
• HTML 5 – Mudanças na estrutura e semântica
• Semântica com o HTML5
• Webcast: HTML5 já é uma realidade
• A evolução para o HTML 5
• http://pt.wikipedia.org/wiki/HTML_5 

CSS Referência tipográfica para cabeçalhos e textos estilizados! »

18mai 2009, às 16:13

Publicado em HTML / CSS | Deixe o seu comentário (1) »

publicado por: Magno Valdetaro

Referências são ótimas e sempre acelaram muito a produção, encontrei no SpeckyBoyesta folha de Referência criada para enfatizar as muitas opções disponíveis dentro da CSS, particularmente para tipografia. Este post está divido em três partes: Propriedades da tipografias da CSS, Fontes padrões da Web e uma tabela de conversão de valores. Espero que seja de grande ajuda para todos!

Styleneat, deixa o CSS organizado! »

12mai 2009, às 09:27

Publicado em Ferramentas HTML / CSS | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro