Como fazer uma div ficar fixa no rodapé quando houver pouco conteúdo na página.

Essa dica é só pra quem usa Firefox heim! Você que é desenvolvedor(a) ou webdesigner sabe que uma coisinha mt chata no processo de codificação de layouts, é quando você precisa recarregar uma página para ver as alterações feitas no CSS e ao pressionar F5 ela recarrega completamente, scrips, imagens, swfs, vídeos e etc, isso demora, irrita e consome preciosos segundos e até minutos.

Pesquisei e encontrei a solução para esse problema. Um script feito por alguem que eu desconheço, mas sou muito grata que inserido como botão à barra de favoritos do Firefox (é no IE não dá), irá fazer o refresh somente no CSS da página que estiver aberta, sempre que for clicado.

Continuar lendo »« Encolher de novo

Pra quem tem filho pequeno ou como eu, nunca cresceu e assiste muito desenho animado, sabe bem quem é o panda mestre de kung-fu que toma conta dos coelhinhos irmãos Yin e Yang.

Então, tava afim de fazer um desenho usando só HTML e CSS e decidi fazer do Mestre pq ele é fofo e fácil de fazer.

Eu já tinha feito uma antes, há mt tempo atrás, era um barman com garrafas e um balcão. rs…

Pra quem ama CSS como eu, quem topa fazer uma galeria de Cartoons feitos com códigos?!?!?

♥ OLHA O MEU ♥

Ah, abre no Firefox por favor, eu não testei no IEca.

Testado e aprovado no Firefox e I.E

Banners em DIVs flutuantes são ótimos em substituir os finados pop-ups. Um bom exemplo pode ser visto em portais como Uol e outros de tenham muita publicidade, são muito usados…

Pra fazer o que tinha em mente eu precisava de três informações:

1- Como colocar uma DIV por cima do conteúdo da página.
2- Em casos de Flash, como deixar o fundo transparente.
3- Como fechar a DIV após a exibição, utilizando um link/botão.

Continuar lendo »« Encolher de novo

Hoje meu amigo Marcus VBP me trouxe boas novidades no ínicio do dia.

Trata-se de uma biblioteca Javascript que serve para fazer com que o Internet Explorer fique compatível com os padrões de desenvolvimento para HTML e CSS.

Resolve questões como PNG transparente, possibilita propriedades com seletores :hover, :focus, :first-child e outros que não funcionavam nas versões antecessoras a versão 7.

Mais uma do Super-Google

♥ Veja exemplos ♥

♥ Baixe a Biblioteca ♥

De vez enquando surge a necessidade de centralizar algum objeto (como divs, imagens, ou até um site inteiro) em uma página independente da resolução do monitor.

Vou colocar aqui como lembrete essa dica que um dia eu li em algum tutorial no site do Maujor.

Nesse exemplo eu centralizei uma div de tamanho 780×184px. Observe que se vc diminuir a janela ou aumentar, o conteúdo vai estar sempre centralizado, tanto verticalmente quanto horizontalmente.

O segredo:

No CSS, nas propriedades do objeto que vc quer centralizar (no meu caso é a div #enter), coloque:

left:50%;
top:50%;
position:absolute;
margin-left:-390px; /* metade da largura do objeto, deve ficar negativo */
margin-top:-92px; /* metade da altura do objeto, deve ficar negativo */

E pronto, já era!!

Desculpa não explicar detalhadamente o tutorial, é que estou com um pouco de pressa, mas você pode analisar o código fonte do meu exemplo e vai ver que não é nada difícil.

Quem foi que disse que somente no Flash é possível fazer sites com efeitos coloridos, piscantes e animados? Já ouviram falar em CSS + :hover + Gif ? rsrs…

Gostaria de aprender a fazer um menu como este

Continuar lendo »« Encolher de novo

‘volume’
controla o volume do texto lido.

’speak’
controla se o conteúdo vai ou não ser lido, e caso positivo se vai ser soletrado ou lido normalmente.

‘pause’, ‘pause-before’, e ‘pause-after’
controla as pausas antes e depois de uma leitura. Isto permite ao usuário separar conteúdos, melhorando seu entendimento.

‘cue’, ‘cue-before’, e ‘cue-after’
especifica um som a ser reproduzido antes e depois do conteúdo, o que pode ser valioso para orientação (bastante parecido a um ícone visual).

‘play-during’
controla um som de fundo enquanto o documento é renderizado (bastante parecido a uma imagem de fundo).

‘azimuth’ e ‘elevation’
proporciona uma dimensão ao som, o que permite ao usuário distinguir vozes, por exemplo.

’speech-rate’, ‘voice-family’, ‘pitch’, ‘pitch-range’, ’stress’ e ‘richness’
controla a qualidade do conteúdo lido. Variando estas propriedades para os diferentes elementos, os usuários podem fazer uma sintonia fina nos conteúdos lidos da apresentação auditiva.

’speak-punctuation’ e ’speak-numeral’
controla a maneira como números e sinais de pontuação são lidos, o que afeta a qualidade da experiência de uma navegação auditiva.

’speak-header’
controla como deve ser lida as células de cabeçalho, antes das células de conteúdo.

Referencia nacional em termos de CSS e (X)HTML!!!

Quem nunca leu o site do Maujor inteiro quando estava aprendendo CSS, ou pelo menos já cruzou com alguns artigos e tutorials sobre XHTML e CSS. Poisé, o Maujor agora saiu da tela e pode ir para a sua prateleira.