Unidades de medida em line-height

Postado por: Pedro Rogério em

Segundo as especificações das CSS 2.1, na propriedade line-height das CSS não é necessário especificar uma unidade de medida concreta(em, px, ou outra qualquer). A melhor opção seria não colocá-la, pois ela hedará o valor da propriedade font-size do elemento:


ul {font-size: 15px; line-height:1;}
li { font-size: 10px; } /* Tomará como line-height 10px */
small {font-size: 80%; line-height: 8px;} /* Tomará como line-height 8px */

O único problema é que o Validador de CSS do W3C não aceita valores sem unidades de medida.

Referências

Meyer Web

  • Categorias: CSS
  • Tags:

Microformats: hCalendar

Postado por: Pedro Rogério em

Voltando ao assunto dos Microformats, dessa vez iremos ver o Microformat hCalendar, ele é muito parecido com o iCalendar, usado na aplicação iCal do MAC. Como já deve ter imaginado, hCalendar é usado juntamente com o XHTML para marcar qualquer tipo de evento.

Para uma melhor compreensão dessa matéria, vamos a um exemplo:


<div class="vevent">
<p>
<a class="url" href="http://www.fimdomundo.com.br/">
<abbr class="dtstart" title="20061101">1 de Novembro</abbr> - <abbr class="dtend" title="20061102">2 de Novembro</abbr><span class="summary">Fim do Mundo</span> - e <span class="location">do Planeta Terra</span>
</a>
</p>
<p class="description">Nós não iremos nos dar bem.</p>
</div>

Como podem ver, tudo fica englobado dentro de uma div com a classe vevent, para marcar que temos dados relacionados a um evento marcado com hCalendar. Dentro da div ficará as informações do evento, que deverá ser marcado corretamente.

Continuar lendo »

Ajax: onde usar e não usar

Postado por: Pedro Rogério em

Estou criando essa lista para ajudar aos desavisados onde melhor aplicar AJAX e onde realmente não seria necessário:

Onde deve-se usar AJAX

  • Interação via formulários
  • Navegação de aplicações do tipo hierárquica
  • Comunicação rápida de usuário a usuário
  • Votações on-line
  • Filtro e manipulação de dados
  • Campos de texto usados comunmente(autocompletar)

Onde não se deve usar Ajax

  • Formulários simples: Se há somente um campo, não há necessidade
  • Buscas: Esse parte é meio pessoal, uns gostam, outros não preferem
  • Navegação básica: Esse também é um erro típico que acaba ocorrendo com o Flash, imagine um Menu com 2 boxes que digam Início e Contato, qual a necessidade de se usar Flash alí, ou até mesmo AJAX?
  • Manipulação de interfaces do usuário: Para manipulação existe o XHTML/HTML, DOM e as CSS, que foram criadas para isso.
  • Widgets inúteis

Guia CSS – 8ª parte: Padding

Postado por: Pedro Rogério em

Padding é a distância do elemento entre a borda e o seu conteúdo. As regras para margem também se aplicam ao padding, excepcionalmente o valor “auto” e valores negativos, que não podem ser declarados:


padding-top: valor;
padding-right: valor;
padding-bottom: valor;
padding-left: valor;

Você também pode declarar esses valores para padding em uma única propriedade:

padding: 10px 10px 10px 10px;

Continuar lendo »

Barra de Acessibilidade no Opera

Postado por: Pedro Rogério em

Barra de Acessibilidade no Opera

Muitas pessoas não sabem, mas é possível instalar uma barra de acessibilidade no Opera, ela é muito parecidíssima com a extensão Web Developer do Firefox. Ela possiu links rápidos para validação do código, opção de habilitar e desabilitar o css, analisador de contraste de cores, opção de vizualização da tela do seu browser em diferentes resoluções, e várias outras coisas bem interessantes. Se você usa o Opera, confira você mesmo.

HTML é semântico

Postado por: Pedro Rogério em

Acho que nunca levantei uma discussão aqui nesse blog, então essa será a primeira. XHTML é mais semântico que HTML? Vou deixar aqui a minha opnião:

Os buscadores entendem perfeitamente o HTML, e mesmo assim eles não deixam de indexar as páginas, logicamente que eles gostam mais de <h1>, <strong> e as tags similares, e esses são elementos que já existiam no HTML.

XHTML é HTML, não há atributos novos nem elementos novos, tudo segue exatamente igual. Vejas as diferenças entre XHTML e HTML no site do W3C.

XHTML não separa melhor o conteúdo da estrutura. Para aqueles que tem terror da tag font, vale lembrar que esse elemento não é permitido seguindo o dtd do HTML 4.01 Strict, quem dirá então o DTD do XHTML 1 Transitional. O DTD do XHTML 1 Transitional é o mesmo do HTML 4 Transitional só que reformulado para funcionar como XML, e o mesmo acontece com as DTD do HTML 4 Strict e XHTML 1 Strict.

E você, qual é a sua opnião sobre esse assunto, deixe aqui o seu Feedback!!!

Texto piscando com CSS

Postado por: Pedro Rogério em

O exemplo que vou citar nos faz voltar aos primeiros anos da Internet, onde tinhamos aquelas interfaces pobres. Com o tempo foram surgindo novos recursos, e um deles foi a tag blink, visando dar mais dinamismo as páginas Web, mas com a evolução do HTML, logo ela caiu em desuso. Mas ainda existe uma forma de implementá-la através de CSS:


<style type="text/css">
.blink { text-decoration: blink; }
</style>

Nosso HTML fica da seguinte forma:


<span class="blink">Aqui você coloca o texto</span>

Veja um exemplo em funcionamento, mas muito cuidado, por que poucos browsers ainda a suportam, eu fiz alguns testes e ele funcionou perfeitamente somente no Firefox, no Opera 9 e no IE não funcionou, se alguém puder testar em outros browsers.

<update 22-11-2006>Ele também não funciona no IE 7</update>

Páginas:«1...93949596979899...108»