[TUTORIAL] Personalizar elemento "quote" nos fóruns

Ir para baixo

[TUTORIAL] Personalizar elemento "quote" nos fóruns Empty [TUTORIAL] Personalizar elemento "quote" nos fóruns

Mensagem por Convidado 06.11.19 17:38

Personalizar elemento "quote" nos fóruns
Com este tutorial, aprenderemos a personalizar a citação.

Personalizar elemento "quote" nos fóruns
Tutoriais, dicas e astúcias

Código CSS

CSS na verdade significa "Cascading Style Sheets", sua principal função é personalizar um determinado conteúdo exibido, em um determinado lugar na página. Cada versão de fórum (phpbb2. phpbb3, punbb, invision e modernbb) possuem uma classe diferente, e nessas classes podem ser adicionadas as “propriedades”. Caso queira conhecer alguns tipos de classes, poderá consultar mais informações no seguinte: Elaborar um código CSS

Painel de controle Seta Branca Visualização Seta Branca Imagens e Cores Seta Branca Cores Seta Branca Folha de estilo CSS


[TUTORIAL] Personalizar elemento "quote" nos fóruns Stylea10

[TUTORIAL] Personalizar elemento "quote" nos fóruns 110111Seta Salvar CSS- Salva todo o CSS em arquivo TXT em seu computador. Em outras palavras, permite criar um backup de seu CSS personalizado.
[TUTORIAL] Personalizar elemento "quote" nos fóruns 110210Seta Forçar CSS base do fórum - Força o CSS padrão da versão de seu fórum, ignorando o CSS personalizado. Caso queira verificar o CSS base d fórum, basta clicar no link "Ver CSS base do fórum".
[TUTORIAL] Personalizar elemento "quote" nos fóruns 110310Seta Desativar o CSS base - Desativa o CSS base da versão de seu fórum, e permite que somente o CSS personalizado do fórum opere em todo o fórum.
[TUTORIAL] Personalizar elemento "quote" nos fóruns 110410Seta Melhorar CSS - Com essa função ativa, a capacidade de carregamento da página é aumentada, facilitando a navegação nas páginas de seu fórum. Mas é importante lembrar que, para que a função funcione normalmente como prometida, você terá que adicionar o código correto na folha de estilo.
Código:
blockquote {
  margin: 1em 1px 1em 25px;
  padding: 5px;
  background: #COR_DE_FUNDO url("URL_DA_IMAGEM") 6px 8px no-repeat;
  border: 1px solid #DBDBCE;
  font-size: 0.95em;
  margin: 1em 1px 1em 25px;
  overflow: hidden;
}

Personalizando o código

Personalizar elemento "quote" nos fóruns
Personalizar o código
marginCom esse atributo, indicaremos o tamanho da margem.
paddingIndica o espaço inserido para esta imagem: [TUTORIAL] Personalizar elemento "quote" nos fóruns Quote 5px (vem por padrão) é o suficiente, mas se quisermos colocar uma imagem assim: [TUTORIAL] Personalizar elemento "quote" nos fóruns Parraf10 necessitaremos de 23px.
backgroundbackground: #COR_DE_FUNDO url ("URL_dA_IMAGEM") 6px 8px no-repeat; é a parte inferior do bloco, podemos mudar a cor de fundo e sua imagem, além de suas dimensões e se queremos que a imagem seja repetida ou não.não repetir; Outras propriedades:* Repeat, a imagem é replicada vertical e horizontalmente.* Repeat-x, replica a imagem apenas na horizontal.* Repeat-y, replica a imagem apenas na vertical.* No-repeat, a imagem não é replicada.
borderÉ a vantagem que podemos ampliar colocando 5px ou mais, solid é um tipo de borda.
font-sizeDefine o tamanho da fonte.
overflowÉ a camada do bloco.
Anonymous
Convidado
Convidado


Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

 
Permissões neste sub-fórum
Não podes responder a tópicos