Como usar float para formas de estilo para html5 e css3 programação
Muitos problemas de layout de página parecem exigir tabelas. Alguns uso inteligente do CSS3 flutuador pode ajudar a elementos com várias colunas sem a sobrecarga de tabelas. Formas causar uma dor de cabeça em particular porque uma forma muitas vezes envolve etiquetas numa coluna esquerda seguido de entrada elementos na coluna da direita.
Você provavelmente estaria tentado a colocar uma tal forma de uma tabela. Adicionar tags de tabela faz com que o HTML muito mais complexo e não é necessária. É muito melhor usar CSS para controlar o layout.
Você pode flutuar elementos para criar formas atraentes sem a necessidade de tabelas.
Como o design da página fica mais envolvido, faz mais sentido pensar o HTML eo CSS separadamente. O HTML lhe dará uma sensação da intenção geral da página, e o CSS pode ser modificada separadamente. Usando CSS externo é uma extensão natural dessa filosofia. Começar por olhar para floatForm.html e concentrar-se sobre a estrutura HTML antes de se preocupar com estilo:
floatForm.html
Enquanto você olhar sobre esse código, observe várias coisas interessantes sobre como a página é projetado:
O CSS é externo. CSS é definido em um documento externo. Isto torna mais fácil para mudar o estilo e ajuda-o a concentrar-se no documento HTML em isolamento.
O código HTML é mínima. O código é muito limpo. Ele inclui uma forma com um. O contém rótulos, elementos e a.
Não há uma mesa. Não há necessidade de adicionar uma tabela como um esquema de organização artificial. Uma tabela não acrescentaria à clareza da página. Os elementos do formulário-se fornecer a estrutura suficiente para permitir que toda a formatação que você precisa.
As etiquetas são parte do design. Você pode usar o rótulo elemento em todo o formulário, dando-lhe um elemento que pode ser denominado como quiser.
Tudo é selecionável. Você deseja aplicar um estilo CSS para rótulos, outro para entrada elementos, e um terceiro estilo para o botão. Você pode configurar o código HTML que você pode usar seletores CSS sem necessidade de qualquer identidade ou classe atributos.
Há um botão. Você pode usar um botão elemento em vez de de propósito. Dessa forma, você pode aplicar um estilo para todo o botão elementos e um estilo diferente para o elemento.
Concepção de uma página como esta para que sua estrutura interna fornece todos os seletores que você precisa é maravilhoso. Isso mantém a página muito limpo e fácil de ler. Ainda assim, não tenha medo de adicionar classes ou IDs se você precisar deles.
É muitas vezes uma boa idéia de olhar para a sua página com HTML reta antes de começar a andar com CSS.
Se você tem uma página com estilos e você quiser ver como vai ficar sem as regras de estilo, use ferramentas para desenvolvedores Chrome ou o Firebug. Você pode desativar temporariamente algumas ou todas as regras de estilo CSS para ver o conteúdo padrão por baixo. Isto às vezes pode ser extremamente útil.