Publicidade

Gabriel42

Arquivo CSS para páginas diferentes

Patrocínio:

Bom pessoal, criei a página inicial a index.html mais ai quero criar as outras páginas tipo a contato.html só que não sei como organizar direito.

 

tipo como vou organizar o código css da contato.html sendo que ja criei o style.css pra pagina index.html 

 

http://prnt.sc/eyxmod (a pasta dos arquivos)

0

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu costumo criar uma pagina com o nome de CSS, e coloco todos os arquivos .css de cada pagina la dentro! no codigo html é só você mudar o nome do aquivo css que vai ser utilizado

 

Ex: eu tenho 2 paginas, a index.html e a contatos.html

 

No index.html eu coloco este codigo para usar este arquivo css

<link id="theme-style" rel="stylesheet" href="css/styles.css">

o codigo html vai procurar na pasta css algum arquivo com o nome styles.css e vai utilizalo!

 

E no contatos.html eu coloco o mesmo code só que o .css com outro nome

<link id="theme-style" rel="stylesheet" href="css/styles-contatos.css">

o codigo html vai procurar na pasta css algum arquivo chamado

styles-contatos.css e vai utilizalo!

 

 

Assim cada pagina tem seu .css separado!

 

espro que você tenha entendi e que eu tenha resolvido seu problema :3

0

Compartilhar este post


Link para o post
Compartilhar em outros sites

o usual é trabalhar com template ou seja tu não vai ter uma página de uma cor outra de outra e tal então tu só tem que criar um arquivo .css e definir como vai ser o head, o footer, os parágrafos, títulos e tal. geralmente são iguais em todas as paginas então só precisa incluir o arquivo css nas paginas e pronto. em php é ainda melhor tem como incluir uma pagina na outra aí tu pode criar uma header.php e uma footer.php e incluir elas nas outras paginas tipo na contato.php por exemplo

include_once('header.php');
// corpo da pagina contato
include_once('footer.php');

 

0

Compartilhar este post


Link para o post
Compartilhar em outros sites
Em 20/04/2017 at 21:29, Gabriel42 disse:

tipo como vou organizar o código css da contato.html sendo que ja criei o style.css pra pagina index.html 

 

@Gabriel42 no mesmo arquivo de estilos, pois - salvo algumas exceções - a estrutura é sempre a mesma. 

 

 

0

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!


Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.


Entrar Agora

  • Próximos Eventos

  • Conteúdo Similar

    • Por Gemeons
      Como inserir Paginação de resultados no código abaixo, para o mesmo só exibir 5 resultado na tabela e fazer um contador  "<1 2 3 4 >" embaixo pra mostra o restante do resultado ??
       
       
       
       
      <?php header('Content-Type: text/html; charset=iso-8859-1');?> <?php $host = "localhost"; $user = "root"; $pass = ""; $banco = "slp"; $conexao = mysqli_connect($host, $user, $pass) or die(mysqli_error()); mysqli_select_db($conexao, $banco) or die(mysqli_error($conexao)); $palavra = $_POST['palavra']; $sql = mysqli_query($conexao,"SELECT * from cadastros WHERE unidade LIKE '%".$palavra."%' LIMIT 0, 2"); $row = mysqli_num_rows($sql); ?> <section class="panel col-lg-9"> <header class="panel-heading"> <br/><br/> </header> <?php if($row>0){ ?> <table class="table table-striped table-advance table-hover"> <tbody> <tr> <th><i class="icon_mail_alt"></i> RPA</th> <th><i class="icon_mail_alt"></i> Unidade</th> <th width="5"><i class="icon_profile"></i> Modalidade</th> <th width="5"><i class="icon_mail_alt"></i> Ano</th> <th width="10"><i class="icon_profile"></i> Turma</th> <th width="10"><i class="icon_mail_alt"></i> Turno</th> <th width="10"><i class="icon_mail_alt"></i> Professor </th> <th width="10"><i class="icon_mail_alt"></i> Matricula</th> </tr> <?php while($linha = mysqli_fetch_assoc($sql)){ ?> <tr> <td width="15"><?=$linha['rpa'];?></td> <td width="15"><?=$linha['unidade'];?></td> <td width="15" ><?=$linha['modalidade'];?></td> <td style="text-align:center" ><?=$linha['ano'];?></td> <td style="text-align:center"><?=$linha['turma'];?></td> <td><?=$linha['turno'];?></td> <td width="15"><?=$linha['nomeProfEfetivo'];?></td> <td width="15"><?=$linha['matricula'];?></td> </tr> <?php }?> </tbody> </table> <?php }else{?> <h4>Nao foram encontrados registros com esta palavra.</h4> <?php }?> </section>  
    • Por victorln1
      pessoal segue o codigo:
      <!doctype html>
      <html lang="pt-br">
          <head>
              <meta charset="utf-8">
          </head>
          <body>
          <style>
              
              #receitas{
                list-style: none;
                width: 74.5%;
                position: relative;
                left: 2%;
                margin: 0;
                padding: 0;
                top: 0px;
                height: auto;
                text-align: justify;
                border: 10px solid black;
              }
              #receitas li{
                width: 190px;
                height: 190px;
                display: inline-block;
                background: red;
                margin: 0 15px 15px 0;
                position: relative;
                left: 0;
                top: 0;
              }
              #receitas:after {
                content: '';
                width: 74.5%;
                display: inline-block;
              }
          </style>
            
              <ul id="receitas">
                  <li></li>
                  <li></li>
                  <li></li>
                  <li></li>
                  <li></li>
                <li></li>
                  <li></li>
                  <li></li>
                  <li></li>
                  <li></li>

              </ul>

          </body>    
      </html>
      o problema deste codigo é quando esta em telas um pouco maiores, que la em baixo fica um li de um lado e outro do outro. como resolvo isso??
    • Por Thiago Franchin
      Menu lateral retrátil apenas com CSS.
      Aprenda nessa vídeo aula a fazer um menu lateral retrátil usando apenas CSS, sem usar nenhum script ou plugin.
      Dicas no vídeo de como usar ícones do Font Awesome.
      Download dos arquivos: https://github.com/thiagofranchin/menuLateralCss
       
       
    • Por Thiago Franchin
      Aprenda a centralizar qualquer elemento.
       
      Tutorial Como Centrar Vertical e Horizontal com CSS
      Neste vídeo vamos aprender como podemos centrar qualquer elemento na horizontal e vertical usando somente CSS. 
      ♦ Exemplo também para sites responsivos com bootstrap 3.