Desciclopédia:Tutorial/html

Origem: Desciclopédia, a enciclopédia livre de conteúdo.
Ir para: navegação, pesquisa
Este artigo pertence ao

Tutorial Básico de html e wiki

Secções...

Introdução
Sobre o site
Criar um artigo
Adicionar links internos e externos
Negrito, itálico, parágrafos e etc.
Separar artigos em seções
Adicionar/criar categorias
Adicionar imagens e vídeos
Adicionar sons
Mover páginas
Escrever citações
Adicionar/criar predefinições
Páginas de discussão
Arquivamento de discussão
Como criar uma página de usuário
Personalizar assinatura
Criando o seu status
Utilizar HTML
Solução de problemas
Página de testes

Para os formandos do curso básico:

Tutorial intermediário de HTML e Wiki

HTML significa HyperText Markup Language. Mas e daí? só nerds querem saber não é necessário saber. Vamos a alguns princípios básicos:

REGRA GERAL: Na Dp não são todos os códigos HTML que funcionam, mas você pode testá-los todos, e ver quais funcionam.

Dica 01: Leia antes a seção negrito, itálico, parágrafos e etc. do tutorial para descobrir quais códigos html podem ser substituídos por códigos wiki, que são mais fáceis e práticos de utilizar.

Dica 02: Caso haja dúvidas em relação aos parâmetros HTML exemplificados aqui, clique em editar no topo da página para ver como eles foram criados.

Tag Font

Considero uma das mais importantes, tendo em vista que os textos predominam a Dp.

Como montar:

Coloca-se < font parâmetro="valor">, antes do texto, e depois, coloca-se </font> para limitar
os parâmentros até este ponto.

Obs.: Parâmetros:

Color: Define a cor da letra. Lista de Cores
Size: Define o tamanho da fonte.
Face: Define qual fonte (Ex.: Comic Sans, Arial, etc.).

Enfim, já dá pra fazer altas coisas idiotas legais com isso.

Negrito,itálico,etc.

Um exemplo de código em itálico.

Mesmo a Dp já tendo um código pra facilitar a vida dos usuários vagabundos, aqui vai uma lista de códigos.

Para aplicar, escreva <LETRA CORRESPONDENTE>texto</LETRA CORRESPONDENTE>
no lugar da Letra correspondente coloque:
 s -> Riscado
 b -> Negrito
 i -> Itálico
 u -> Sublinhado
 tt -> Espaçamento fixo todas as letras ficam do mesmo tamanho.
 sub -> Coloca o texto aqui.
 sup -> Coloca o texto aqui.

Criando coisinhas gays

Sabe aqueles negócios que parecem botões, como na minha assinatura: Descicloped500px-Flag of Brazil.svg.pngia_Página_cont._conv. , você sempre quis fazer? Então aqui vai.

Um simples

< span style="background-color:red;">Texto</span>

Seja lá o que você for fazer, só altere as coisas que estão em negrito.
Esse código cria isso:
Texto

Regra: Entre cada comando, dentro das aspas, coloque ponto e vírgula(;)

BORDA: Para fazer uma borda insira no código:

border: TAMANHOpx ESTILO COR;
 TAMANHO: O número que você quiser, não esqueça do 'px'. 
          Você também pode colocar 'em', %, 'pt', 'cm', etc. (não é brincadeira!)
 ESTILO:
    outset
    dotted 
    dashed    
    inset
    groove
    ridge
    double
 COR: Blue, Red, Green e outras cores que você aprendeu na escolinha de inglês.

Exemplinho:

< span style="border:1px dotted green;">exemplo</span>
exemplo

FONTE: Mexendo na fonte.

font-family: 'FONTE';
 FONTE: Tahoma, fixedsys, arial, etc.
font-size: TAMANHOpx
 TAMANHO: é o tamanho :P, seguido do 'px'. Outra vez, pode-se usar 
          também unidades mirabolantes, mas aí acho que vira merda.

Exemplinho:

< span style="font-family:'Times New Roman'; font-size:25px;">exemplo</span> 
exemplo

Esta forma de se aplicar estilos é, no geral, a mais recomendada, pois além de permitir que se aplique múltiplos - e variadíssimos, muito mais do que se pode imaginar - estilos numa tag só, não utiliza as outras tags específicas de estilo (<font>, <b>, <i>, etc.), que estão caminhando para o obsoletismo à medida que o HTML se desenvolve.

Inutilidades Finais

Alguns comandos com certa inutilidade.

< br> -> O que vier depois desta tag, será colocado na linha seguinte.
< p>texto</p> -> Isola o 'texto'. Com uma linha de diferença acima, e uma abaixo.
< hr> -> Insere uma linha horizontal
  Coloque 'width=X' para definir o tamanho, onde X é o valor, seguido de "px".
  Também pode ser utilizada uma porcentagem como '50%', e a linha ocupará metade do espaço disponível.
< poem> -> evita quebras de linha, ideal para fãs do Descionário