Modificação de layout css em adobe cs5 dreamweaver
Video: Dreamweaver CS5 - CSS Tutorial: Layout
Conteúdo
Abode Creative Suite 5 (Adobe CS5) Dreamweaver fornece várias maneiras de mudar um layout de página Cascading Style Sheets. Um layout CSS é controlado completamente por regras de folhas de estilo, assim você pode modificar a aparência da página diretamente do painel de estilos CSS e Inspetor de propriedades.
Cada coluna, caixa, e espaço em sua nova página está posicionado e dimensionado utilizando regras CSS e propriedades, os quais você pode ajustar tanto a partir do Inspetor de propriedades (no painel Estilos CSS) ou o painel Definição de regra CSS.
Se o painel Estilos CSS ainda não estiver aberto, escolha Janela → Estilos CSS para abri-lo.
Selecione a guia Tudo para exibir a folha de estilo e suas regras.
A folha de estilo interna é mostrada como no topo. Clique na seta para a esquerda para expandi-la e mostrar todas as regras que ela contém. Layouts usando uma folha de estilo ligados (externo) exibir o nome de folha de estilo (tal como styles.css) em vez da tag.
Selecione os corpo regra.
Este estilo baseado em tag controla a formatação geral de toda a página (tudo dentro do tag).
Clique no campo ao lado da regra de fundo para editar ele- ao invés de manter o # 4E5869 (Cinzento médio) definindo, digite uma cor hexadecimal (tal como # CC0000 para o vermelho) para alterar a cor de fundo da página.
Clique na amostra ao lado da regra de cor para abrir as Amostras Painel de escolher uma nova cor tipo padrão para o texto em sua página.
Na parte superior do painel Estilos CSS, selecione outro estilo (por exemplo, o .estilo #container twoColElstHdr) Para visualizar as suas propriedades.
o .twoColHybLtHdr #style ID recipiente controla o tamanho ea aparência do contêiner de layout principal da página.
No Inspetor de propriedades, edite as propriedades para alterar a aparência do estilo.
Por exemplo, você pode alterar a largura da regra introduzindo um novo número na caixa de texto da Regra Largura. Se você digitar 95%, por exemplo, você faz todo o layout mais amplo.
Video: How To Design a Website in Adobe Dreamweaver | Adobe Dreamweaver CS5 Beginners Tutorial
Cada coluna e seção que compreende o seu layout é controlado por um dos estilos de identificação listados no painel Estilos CSS. A maioria cada estilo ID possui uma propriedade de largura você pode usar para alterar o tamanho de áreas diferentes na página.
Continue a modificar estilos diferentes listados no painel CSS Styles e ver como eles afetam elementos diferentes em sua página. Tente mudar a cor tipo, família de fonte e outras propriedades, como o preenchimento ea cor de fundo.
Para descobrir exatamente quais controles de identificação que coluna ou seção, clique dentro da área de página e olhar para o seletor de tags na parte inferior da janela do documento. A última tag no final da cadeia mostra quais recipiente onde se encontra e seu ID correspondente no painel Estilos CSS (por exemplo,).