· Artigos » Dreamweaver» Versão para Impressão

 

Estilo CSS em Formulários

Por: | Publicado em: 09.12.2005 | Visualizações: 48441

Hoje minha primeira coluna aqui, mas deixa de papo e vamos ao serviço

Vamos começar logo...

Versão Utilizada no Tutorial: Dreanweaver 8
Nível: Iniciante
Dificuldade: 7,5

1- Crie um formulário normal , no meu caso criei um com os campos nome, email e mensagem.

""

2- Clique na barra de ferramentas na opção Window > CSS Styles:

""

3- Após abrir a janela a cima , clique em New CSS Style, mais embaixo da tela, a janela aberta ira criar um novo css pare seu site , veja a imagem abaixo e suas funções

""
Deixe com as configurações acima

Name -> O nome de seu css , sempre começando com o ponto , ex: .formulario
Type -> O tipo de css
Define in -> clicando na primeira opção você ira salvar seu css para que possa ser usado em outros formularios ou sites, Ao clicar em This Document Only você ira utilizar esse css apenas para esse documento no caso o nosso formulário.

4- Clique em OK , e irá abrir a tela para configurar seu css, vamos aos detalhes.

""

Type - > Aqui você irá determinar a fonte a ser usada dentro do formulario quando preenchido , cor , tamanho , estilo, etc.
Background - > Nessa parte será configurada o fundo dos campos do nosso formulário.
Block - > Determina os espaçamentos e alinhamentos do seu formulário.
Border - > Escolher cor de borda dos campos, tamanho , etc...

Para nosso formulário só serão necessários esses campos , os demais servem para configurar camadas e outras coisas.

5- Após configurar cor , tamanho , estilo e tudo mais do nosso formulário , vamos aplica-lo em nosso form. Repare que o nome do nosso CSS apareceu na janela da barra direita de css do Dreamweaver, Para aplica-lo basta clicar no nome do css na barra direita e depois clicar no campo desejado do nosso form .

OBS: Clicando com o botão direito do mouse em cima do nome do CSS aparecera uma lista de opções que é para Editar, Duplicar, Deletar, Exportar, etc...

Veja o exemplo de como ficou nosso formulário:

""

Por hoje é só..
Sugestões, dicas, etc. me mandem um e-mail:
murilo@bestporttal.com

Ah entrem no meu site também
www.bestporttal.com

 


© 2017 - Direitos Reservados
www.portaldigidesign.com.br