Como usar o css para criar modelos de documentos

Video: Criando Templates Personalizados para sites PHP/HTML - Modelo I - Criando o Topo #01

Tenho vindo a trabalhar na web por um tempo agora, e eu realmente achei mais fácil de escrever todos os documentos em formato HTML em vez de DOC ou TXT. Se você usa o Google Docs, você está realmente fazendo o mesmo, já que o Google Docs tem (felizmente) essencialmente tornar-se um editor WYSIWYG HTML. Criação de alguns modelos de documentos usando HTML e CSS é muito fácil, pode ser feito por todos, e se você fizer isso direito, ele vai olhar o mesmo para todos.

Por que usar HTML?

Meu maior razão para ir para puramente documentos HTML e CSS é que ele é provavelmente o formato mais compatível em todos os navegadores e sistemas operacionais, exceto para o formato PDF, que é muito difícil e / ou caro para fazer bem. Usando Microsoft Office também não é a melhor. Eu uso o Office 2007 que usa um monte de recursos extras não suportados por versões anteriores, de modo que a qualidade pode ser rebaixado. Quem sabe o que esses documentos será semelhante no Open Office, por exemplo? Se você criar um documento HTML que se parece exatamente o mesmo no Internet Explorer e Firefox que você tenha criado um documento que pode ser aberto por usuários Mac, Linux e Windows, e vai olhar o mesmo em 99% dos browsers.

O que é CSS e HTML?

Se você é novo para todo este HTML e codificação coisa CSS, não se assuste. É muito fácil, e você pode encontrar a abundância de recursos na web para ajudá-lo. Código HTML e CSS é o que compõe a maioria do que você vê nesta página aqui, HTML governa o conteúdo, enquanto CSS governa o estilo ou a forma como o conteúdo é apresentado.

Como posso criar um modelo?

Bem, você precisa estudar um pouco de código. Felizmente, HTML e CSS é muito fácil de entender. Para dar um objeto a fronteira por exemplo, basta digitar

border: 1px solid preto

. Isto irá criar uma ampla borda sólida preta 1px. Há um monte de opções de formatação que você pode olhar para cima e usar, a minha sugestão é visualizar o que você quer, e então pesquisar um pouco para encontrar a forma de fazê-lo. O modelo mais básico seria um arquivo HTML vazio, dê uma olhada abaixo.

Título da página vai aqui

Todo o seu estilo entra aqui

Video: Curso de HTML5 - 20 - Estilos CSS para Tabelas em HTML5 - by Gustavo Guanabara

O conteúdo da sua página vai aqui.

Você pode, em seguida, preencher tudo isso com o conteúdo e estilo para criar o documento. Dê uma olhada no exemplo 1, o exemplo 2 e exemplo 3 que eu fiz. Tenha em mente que o código no corpo, o conteúdo é exatamente o mesmo, eu só estou mudando o código css. Isso mostra que você pode usar o estilo para criar looks diferentes rapidamente.

Por que isso é tão grande?

A razão isto é tão incrível é que você pode criar estilos personalizados para si mesmo que pode se tornar uma espécie de “marca” dos seus documentos. Você pode recortar e colar o código CSS e só de pensar o conteúdo uma vez que você finalizou ele. Além disso, você pode ligar na folha de estilo, por isso, se você armazenar documentos online, você não tem que incluir a CSS no próprio arquivo. Isto significa que você pode ligar diferentes folhas de estilo para diferentes ocasiões, e você não tem que modificar o documento o tempo todo.

CSS também permite mais rápido edição de documentos estilo-wise. Eu prefiro meus documentos para uma boa aparência, porque eu me sinto melhor assim, e com CSS o processo de formatação torna-se muito menos de um fardo. Quando você especifica um estilo de título, ela será aplicada a todos os títulos desse tipo. Isto significa que você não tem que mudar individualmente a cor de fundo, cor de fonte, ousadia e sublinhado de um título, você especificar apenas uma vez.

Além disso, desde que o Google Docs agora tem suporte completo CSS, você pode simplesmente copiar e colar o código de styling em Docs e alterar a aparência de seus documentos sem ter que ir ao redor de formatar cada dirigindo um de cada vez.

Onde posso aprender mais?

Como eu disse, CSS é uma ferramenta simples, mas requer alguns conhecimentos básicos, no entanto. HTML é semelhante lógico e fácil de aprender, eu recomendo W3Cschools para ambos. Eu aprendi muito do que sei hoje existem, para as necessidades básicas é um dos melhores sites na net. W3C também desenvolve os padrões web, então você pode ter certeza que tudo o que eles escrevem em seus trabalhos página.

Outra página que eu usei para aprender muito com foi sua fonte HTML. Esta página contém HTML e CSS, e também algumas dicas avançadas sobre codificação, promoção, a acessibilidade, e, geralmente, como criar um bom site. Tem grande CSS ajuda embora, definitivamente vale a pena uma visita.

Finalmente, você pode dar uma olhada em alguns blogs relacionados e artigos como este roundup incrível de técnicas CSS essenciais e 53 técnicas que você não pode viver sem.