A Regra ‘Border Radius’ em CSS 3
Este é o meu terceiro artigo na série de artigos sobre ‘Regras CSS 3′ e é, mais uma vez, sobre como dar estilos a borders usando CSS 3. Esta regra também é conhecida como ‘cantos arredondados’ porque nos permite atribuir um valor para o raio dos cantos das bordas.
Esta tem sido provavelmente a regra de CSS 3 mais usada visto que é correctamente interpretada pela grande maioria dos navegadores de Internet decentes. Funciona na perfeição no Mozilla Firefox, Google Chrome, Safari e Opera.
Tabela de Compatibilidade
 |
 |
 |
 |
 |
|||||
| 4 | 5 | 3 | 3.6 | 10 | 10.5 | 4 | 7 | 8 | 9 |
 |
|
|
|
 |
|
|
|
|
|
Como Usar
Quando queremos que todos os cantos tenham o mesmo valor para o raio, usamos o seguinte:
A Regra ‘Border Image’ em CSS 3
Este é o segundo artigo da série de artigos que estou a escrever sobre ‘Regras em CSS 3′, e é mais uma vez sobre como estilizar bordas através do uso de CSS 3. Mas desta vez, vamos ver como podemos estilizar bordas através do uso de uma imagem, em vez de cores.
É verdade!… O CSS 3 permite-nos usar uma imagem em vez de vários pixeis coloridos (assumindo que uma imagem não é um conjunto de vários pixeis coloridos!) para estilizar bordas. Assim é possível criar bordas de objectos exactamente como pretendemos que elas fiquem.
Para o Mozilla Firefox e para os navegadores baseados no Webkit como o Safari e o Google Chrome, a declaração CSS é algo deste tipo:
1 2 3 4 | div { -moz-border-image:url(border.png) 30 30 30 30 repeat; -webkit-border-image:url(border.png) 30 30 30 30 repeat; } |
Abaixo pode verificar o que cada um daqueles valores está a definir (da esquerda para a direita):
Optimização de Imagens para a Web
Um dos aspectos a que se deve dar muita atenção quando se coloca um website, ou qualquer outra aplicação, online é a velocidade a que ela carrega no browser do utilizador. Ninguém gosta de esperar séculos até que uma página seja aberta.
Uma maneira de se conseguir isto é optimizando o tamanho em bits das imagens que vão ser descarregadas pelo utilizador. Aliás, como sabe, as imagens são, por norma, os ficheiros mais exigentes de uma página web.
Há uns meses atrás encontrei o Yahoo Smush.it – uma ferramenta web incrível que lhe permite reduzir o tamanho (refiro-me a bits, não a dimensões físicas) das suas imagens. O Smush.it é uma ferramenta que não altera a qualidade das suas imagens. Quer isto dizer que pode optimizá-las para a web sem perder o seu aspecto ou qualidade visual.
Geradores de Imagens Online
Deixe-me adivinhar! Precisa de uma imagem de fundo engraçada para o seu website, blog, página do Facebook ou do Twitter mas não sabe como criar uma.
Há uns anos atrás isso podia ser um problema, mas já não é. Hoje há vários geradores de imagens que lhe permitem, de um modo muito simples, criar imagens de fundo como um profissional. Pode criar uma imagem à sua medida e, no fim, só precisa de a descarregar e usá-la onde e como quiser. Pode usar estas imagens para o efeito que bem entender – como imagens de fundo, botões, imagens para o cabeçalho do seu blog, etc.
Abaixo encontra alguns exemplos:
A Regra ‘Border Colors’ em CSS 3
CSS 3 é a mais recente versão do CSS e trouxe-nos a nós, web developers, muitas funcionalidades novas. Infelizmente alguns navegadores de Internet ainda não a interpretam completamente e outros (sim, refiro-me ao Internet Explorer) nem um só bocadinho.
No entanto, o CSS 3 não só é o futuro mas já é, também, uma grande parte do presente. É por isso que eu decidi escrever sobre uma nova regra de CSS – Border Colors (repare no ‘s’ em ‘colors’).
A regra ‘Border Colors’ permite-nos definir mais do que uma cor para as bordas dos objectos HTML. Com esta regra, é possível ter tantas cores como o número de pixeis da largura da borda. Quer isto dizer que, se tivermos uma borda de 3 pixeis, podemos ter 3 cores diferentes nessa borda. Se, por alguma razão, decidirmos definir apenas duas cores, a última cor irá estar presente nos restantes pixeis dessa mesma borda.
Os 5 Melhores Alojamentos Gratuitos para Websites
Há muitos serviços de alojamento online gratuito de websites. Mas na sua grande maioria são pouco fiáveis, lentos, têm poucas funcionalidades e, por vezes, são até desonestos. No entanto ainda é possível alojar um website numa plataforma de alojamento online gratuito, desde que se escolha a ideal de acordo com o que precisamos.
Há uns meses atrás, fiz uma pequena pesquisa para um outro website meu – Free Web Hosts – e cheguei a uma pequena lista de serviços de alojamento online gratuito que gostava de partilhar com os meus leitores.
| AwardSpace – [ http://www.awardspace.com/ ] | |||||
| Espaço em Disco | Transferência | Domínios Addon | Sub-Domínios | Contas E-mail | Bases de Dados MySQL |
| 250MB | 5GB/mês | 1 | 3 | 1 | 1 |
| O AwardSpace.com é, provavelmente, o serviço gratuito de alojamento em que mais se pode confiar. Já existe há muitos anos e continuam a oferecer as excelentes médias de uptime e velocidade que sempre ofereceram. Não oferecem muito espaço em disco, nem muita largura de banda, nem mesmo muitas contas de email ou muitas bases de dados MySQL, mas se não precisar destas características em grandes quantidades, este é o que eu aconselho. | |||||
Mensagens de Informação e Erro em CSS
Há muitas maneiras de criar ‘caixas de aviso’ com o uso de CSS. A que eu mostro neste post, é apenas mais uma maneira de o fazer.
Vou dar um exemplo neste post e quatro exemplos na demonstração, mas o número de diferentes alternativas que se pode tirar destes exemplos é ilimitado.
O que eu vou fazer é, basicamente, estilizar um DIV com CSS, com uma imagem de fundo à esquerda, uma cor de fundo, e uma borda no topo e no fundo da caixa, para a tornar mais atraente. Esta solução funciona em todos os navegadores de Internet (Sim… até no Internet Explorer!), por isso pode usá-la em qualquer lado.
De Joomla para WordPress
Já concluí a migração do meu blog de Joomla 1.5 para o WordPress 3. Bem… não foi exactamente uma migração visto que tudo o que eu fiz foi refazer o meu template e copiar algumas das entradas que eu tinha na minha instalação anterior.
Não houve nenhuma razão determinante para fazer esta mudança de plataformas – eu continuo a gostar do Joomla. Mas houve, isso sim, algumas razões pouco relevantes para o fazer:
- O Joomla mantém grandes problemas na criação de SEF URLs (mesmo usando extenções). Com extenções, os URLs até podem ficar “amigos dos motores de busca” mas nunca chegam a ficar “amigos do gestor do website”. Os SEF URLs no WordPress funcionam impecavelmente.
