Como ligar folhas de estilo em cascata (css) com o dreamweaver

usuários do Dreamweaver pode facilmente inserir uma tag link para um Cascading Style Sheet externa (CSS), sem ter que memorizar todo o código necessário ou a sintaxe apropriada. Além disso, ao criar links para um arquivo CSS externo no Dreamweaver, você também pode usar essa oportunidade para selecionar um tipo de mídia CSS, se desejado.

Nas etapas a seguir, você descobrir como vincular um arquivo CSS externo com o todos tipo de suporte para um arquivo HTML aberta no Dreamweaver.

Para completar todos os passos, você precisa Dreamweaver junto com arquivos HTML de amostra e CSS, que você pode criar rapidamente em seu próprio país.

Coloque as duas cópias dos arquivos salvos em uma pasta em seu computador e, em seguida, prosseguir com os seguintes passos:

  1. Inicie o Dreamweaver e criar um site gerido pela escolha do Site → Novo site.

    A caixa de diálogo Configurações do Site aparece, mostrando a categoria do site, que exibe campos para o nome do site e pasta do site local.

  2. No campo Nome do site, digite o nome do seu site.

    Digite um nome que corresponda ao nome do cliente ou indica o propósito de seu site é melhor, como ABC Companhia ou meu blog.

  3. No campo Pasta Site Local, verifique se o caminho aponta para a pasta em seu computador que você deseja usar para este site.

    Por exemplo, se você tiver uma pasta em seu computador dedicado a sites locais e que deseja criar uma pasta dentro de que para abrigar os arquivos para um novo site ABC Company, o seu caminho de pasta do site local pode ser algo como isto:

    UsersyourusernameDocumentslocal-sitesABC web
  4. Clique em Salvar para fechar a caixa de diálogo.

    Seu novo site geridos abrir, exibindo todos os arquivos existentes e pastas (se houver) no raiz pasta no painel Arquivos.

  5. No painel de arquivos, abra o arquivo HTML que você estará adicionando o link CSS para.

    Video: Curso CSS ( Aula 03 ) -- CSS como Usa-lo? exitem 3 modos! [Incorporando CSS em suas páginas HTML]

    O arquivo que você usa deve ter algum tipo dentro dela e ser marcado com o parágrafo, h1, e lista tags.



  6. Para adicionar o link, clique no ícone Anexar folha de estilos (que se parece com um pequeno pedaço de corrente) na parte inferior do painel Estilos CSS.

    Clicando no ícone abre a caixa de diálogo Folha Anexar Estilo Externa. Se você não ver o painel Estilos CSS no espaço de trabalho do Dreamweaver, escolha Janela → Estilos CSS para abri-lo.

  7. No campo de texto File / URL, digite o nome do arquivo CSS que você gostaria de conectar-se a ou clique no botão Procurar para localizar e selecionar o arquivo CSS desejado.

    Se você estiver usando os arquivos de exemplo que você acabou de baixar a partir da web, clique no botão Browse para navegar até o local onde você salvou os arquivos de amostra e selecione o arquivo cssdemo.css.

  8. No Adicionar Como a área da caixa de diálogo, clique no botão Importar rádio Fazer a ligação ou para selecionar o método desejado para adicionar o arquivo CSS para sua página HTML.

    A opção Fazer a ligação adiciona o CSS como um arquivo externo usando a tag:

    A opção Importar especifica o CSS externo dentro de um link de estilo dentro da cabeça da página usando a @importar at-regra. Tenha em mente que este método não é recomendado para consultas de mídia CSS3:

  9. Na área do menu drop-down da mídia, digite a palavra de tudo, ou clique seta para baixo do menu e selecione a todos tipo de mídia.

    Para especificar vários tipos de mídia em vez de apenas um, digite os nomes de cada um dos tipos de mídia desejados, separados por vírgulas e sem espaços, como em tela, impressão, tty.

  10. Se desejar, clique no botão de visualização da caixa de diálogo para ver como a estilos de arquivos CSS seu arquivo HTML de amostra recém-ligados.

  11. Clique em OK para concluir o anexo do arquivo CSS externo.

    painel Estilos CSS do Dreamweaver agora exibe o arquivo CSS recém-anexado e lista todos os estilos dentro dela, e o arquivo HTML de amostra é denominado com as regras de estilo sobre a CSS vinculado.


Publicações relacionadas