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.

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.

Cheat Sheet para Webdesigners »

24set 2009, às 08:56

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

publicado por: Magno Valdetaro

Posso afirmar que você não lembra de todos os atributos, classes, tags, funções e atalhos que todo desenvolvedor web precisa conhecer no dia a dia, certo ou errado?

É aí que entra uma Cheat Sheet, uma “colinha”, para te ajudar naquele momento em que a memória falhar (tá lembrando do colégio?). A Cheat Sheet é um documento que contém as informações mais básicas sobre um software, linguagem e por aí vai.

CSS3 Digest »

22set 2009, às 08:02

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

publicado por: Magno Valdetaro

jQTouch - Crie sofisticadas aplicações móveis com HTML, CSS e jQuery! »

08set 2009, às 08:49

Publicado em Ferramentas jQuery | Seja o primeiro a comentar (0) »

publicado por: Magno Valdetaro

jQTouch é um plugin do framework jQuery de desenvolvimento web para dispositivos móveis (PDA, iphone, celular, tablet e por aí vai). Com este plugin você pode criar sofisticadas aplicações apenas utilizando HTML, CSS e JQuery.

Typetester - Compare Fontes para tela »

03set 2009, às 10:09

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

publicado por: Magno Valdetaro

Typetester é um aplicativo online para comparação das fontes em tela. A sua tarefa é tornar mais fácil a vida dos web designers.

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!