[TUTORIAL] Arredondar as bordas das categorias do fórum

[Fry]

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Efeito CSS

Este tutorial ensina como editar as bordas das categorias do seu fórum para quem deseja ter o visual do seu fórum mais arredondado ou até mesmo mais personalizado através dos códigos CSS. Caso deseje saber mais acerca de arredondamentos do fórum consulte o tópico [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Atenção: Os códigos mencionados neste tutorial não terão efeito quando o Fórum for acedido pelos através do Internet Explorer.

--> Tutoriais, Dicas e Astúcias <--
Arredondar as bordas das categorias do fórum

1º - Arredondar as bordas das categorias do fórum:
Vamos começar primeiramente arredondando as bordas das categorias. Para isto terá de adicionar o código correspondente à versão do seu fórum na folha de estilo css:

PhpBB 2

.forumline {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border: 1px solid #000000;
}

th {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border: 1px solid #000000;
}

PhpBB 3

.forabg {
-moz-border-radius:10px;
-webkit-border-radius: 10px;
}
.forumbg {
-moz-border-radius:10px;
-webkit-border-radius: 10px;
}

PunBB

.main .main-head {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border: 1px solid #000000;
}

Invision

div.maintitle {
-moz-border-radius:10px;
-webkit-border-radius: 10px;
}

Vermelho: Alterar a amplitude do arredondamento (mais ou menos arredondado)
Verde: Alterar a cor da borda

Explicando: Vamos agora a explicação das propriedades utilizadas: O código -moz-border-radius corresponde ao navegador "Mozilla". A unidade definida para esta propriedade definirá o tamanho do arco de arredondamento dos cantos das páginas do Fórum. Já quanto à propriedade -webkit-border-radius, destina-se aos navegadores: Safari, Epiphany, Google Chrome, Midori, Arora, OmniWeb, iCab, Shiira, ABrowse. À semelhança da propriedade anterior o valor definirá o tamanho do arco de arredondamento dos cantos das páginas do Fórum.

2º - Adicionar o código à folha de estilo CSS:
Terá de aceder a;
Painel de Controle -> Visualização -> Imagens e cores -> Cores -> Folha de estilo CSS

(clique na imagem para aumentar)
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Deverá colocar o código, nesta página. Se já contém algum código, deve adicionar o código de arredondamento, assim como qualquer outro que adicione futuramente, depois do já existente.

---

© Fórum dos Fóruns & Profile

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: [Dúvida] Arredondar as bordas das categorias do fórum