About CSS page layouts/pt-br
From Joomla! Documentation
This page is a candidate for deletion. The given reason is: This page is orphaned. The information, while relevant and well written, might be better placed elsewhere like https://docs.joomla.org/More_advanced_Joomla!_templates, rather than being an article on its own.
This notice should remain for a minimum of 1 week after it was placed on the page. If discussion is still ongoing, it should remain until a consensus is reached, after which the page will either be deleted or this notice removed. If you disagree with its deletion, please discuss your reasons on its associated talk page, as applicable.
Remember to check if anything links here and the page history before deleting.
Last edit by FuzzyBot (talk · contrib) · Last edited on Sat, 17 Oct 2020 11:08:03 +0000
Sites profissionais separam formatação e conteúdo. Existem várias razões, sendo a capacidade de controlar muitas páginas modificando um arquivo, a mais óbvia (para um desenvolvedor). Os estilos de Formatação incluem fontes, fundos, imagens (que se repetem em cada página), posição e dimensão de elementos etc. Seu arquivo HTML fica apenas com a informação do cabeçalho, alguns elementos e textos gerais. Ao criar um tema Joomla temos além disso código PHP para apresentar a informação do cabeçalho, posições dos módulos e o conteúdo principal.
As informações de estilos ficam na folha de estilos - o CSS, e costumam ficar em arquivos com a extensão .css. A página web possui um link para o arquivo CSS para que o navegador encontre o estilo apropriado a ser aplicado. O código CSS também pode ser inserido dentro do HTML entre as tags <style type="text/css"></style>.
Todo código CSS é aplicado a um elemento de uma página html/xml. Se quiser que um estilo se aplique a toda página, o melhor seria aplicar ao elemento <body>. É possível aplicar estilos a qualquer elemento como <p>, <table> ou <div>. Para aplicar um elemento específico é necessário que tenha uma ID. Por exemplo, para formatar a <div> contendo o título, inclua primeiro uma ID no HTML - <div ID="title">.