Mudanças entre as edições de "Como Usar"
Ir para navegação
Ir para pesquisar
Linha 90: | Linha 90: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
− | <div style="margin:2em auto;border:1px solid red | + | <div style="margin:2em auto;border:1px solid red;width:400px;"> |
− | <span style="background-color:#000;color:#fff;box-shadow:2px 2px 3px #333;">Fundo Preto, Letras Brancas, Objeto Pai no Centro</span> | + | <span style="background-color:#000;color:#fff;box-shadow:2px 2px 3px #333;padding:1em;margin:1em">Fundo Preto, Letras Brancas, Sombreado, Objeto Pai no Centro da Tela</span> |
</div> | </div> | ||
[[Categoria:Manual]] | [[Categoria:Manual]] |
Edição das 13h49min de 12 de maio de 2014
Como usar este Wiki
Abaixo uma séria de exemplos de formatação, para servir de base na criação de novos manuais.
Como editar
Tags para formatação básica
''texto''
Para itálico'''texto'''
Para negrito'''''texto'''''
Para itálico e negrito=texto=
Título equivalente a <H1>, é o padrão do título de cada artigo, preferir o uso dos subtítulos abaixo==texto==
Subtítulo de nível <H2> (gera uma barra/borda na base da linha horizontal)===texto===
Subtítulo de nível <H3>====texto====
Subtítulo de nível <H4>=====texto=====
Subtítulo de nível <H5>======texto======
Subtítulo de nível <H6><nowiki>''</nowiki>
Permite usar os caracteres especiais da Wiki, em uma porção de código, o texto deve estar entreNOWIKI
<code>x := 1+2;</code>
Formata o conteúdo entreCODE
com uma fonte monospace, ideal para códigos de programação----
Uma linha horizontal, uma barra, como o<hr />
do HTML*
Asteríscos geram bullets lists, ou listas não ordenadas, como a deste menu, você também pode encadear, ex:
* Lista em nível 1 ** Lista em nível 2 ** Continuação de lista em nível 2 * Continua a lista em nível 1
- Gera como saída:
- Lista em nível 1
- Lista em nível 2
- Continuação de lista em nível 2
- Continua a lista em nível 1
- Lista em nível 1
#
Sustenidos geram listas ordenadas, você também pode encadear, ex:
# Lista em nível 1 ## Lista em nível 2 ## Continuação de lista em nível 2 ### Lista de nível 3 # Continua a lista em nível 1
- Gera como saída:
- Lista em nível 1
- Lista em nível 2
- Continuação de lista em nível 2
- Lista de nível 3
- Continua a lista em nível 1
- Lista em nível 1
<big>texto</big>
Um texto grande:
(dois pontos) gera uma indentação, um recuo no texto com quebra de linha, pode ser usada uma ou mais sequências a fim de evidenciar mais a distância da esquerda da área de leitura
Sem Indentação :Indentação 1.1 :Indentação 1.2 ::Indentação 2 :::Indentação 3
- Gera como saída:
- Sem indentação
- Indentação 1.1
- Indentação 1.2
- Indentação 2
- Indentação 3
- Indentação 2
<br/>
Uma quebra de linha. O wiki faz a quebra de linha automaticamente, a cada linha em branco. O<br />
faz com que um texto possa ter as linhas quebradas mesmo que escrito linha abaixo de linha, ex:
Uma linha Outra linha, a linha em branco acima gera para esta linha (atual) um novo parágrafo. Outra linha, mas por a linha anterior não ter terminado em BR, esta linha no resultado final estará junto a linha acima<br /> Outra linha de novo, mas esta linha foi escrita abaixo da anterior, mesmo tendo espaço ao lado, pois foi usado o BR, onde há BR há uma quebra de linha (BREAK LINE)
Para formatar partes de código, pode ser usado o comando <syntaxhighlight lang="php">
onde em LANG define-se a linguagem a ser formatada no código. Ex:
<syntaxhighlight lang="php"> function valida_email($endereco) { $regra = "^[-_a-z0-9]+(\\.[-_a-z0-9]+)*\\@([-a-z0-9]+\\.)*([a-z]{2,4})$"; return eregi($regra, $endereco); } </syntaxhighlight> <syntaxhighlight lang="html4strict"> <div style="margin:5em 20em;border:1px solid red;padding:5em;"> <span style="background-color:#000;color:#fff;">Fundo preto letra branca</span> </div> </syntaxhighlight>
Suporte a HTML e CSS
Você também pode usar as tags do HTML para criar conteúdos diferentes com cores e formatações diversas. Mas é importante não abusar deste recurso devido a falta de padronização que causa.
Ex:
<div style="margin:2em auto;border:1px solid red;padding:1em;width:300px;">
<span style="background-color:#000;color:#fff;">Fundo Preto, Letras Brancas, Objeto Pai no Centro</span>
</div>
Fundo Preto, Letras Brancas, Sombreado, Objeto Pai no Centro da Tela