Jump to content
Sign in to follow this  
william_developer

Carregar um Estilo um Para Cada Navegador

Recommended Posts

Boa tarde; Pessoal, gostaria de saber como eu faço para carregar um estilo para cada navegador diferente, por exemplo

If(Chrome){

<link rel="stylesheet" href="css/estilo_chrome.css">

}else if(ie){

<link rel="stylesheet" href="css/estilo_firefox.css">

}else if(IE){

<link rel="stylesheet" href="css/config_IE.css">

}else{

<link rel="stylesheet" href="#">

//aqui eu procuro um estilo que deixe mais ou menos todos em um padrão caso nem uma das condições acima seja verdade

}

Share this post


Link to post
Share on other sites

Caso você utilize Jquery, sei de uma maneira que talvez te ajude. Sei também que o tópico é antigo, mas vai que alguém ainda precise dele.

        if (jQuery.browser.mozilla){
         // Seu código aqui se for o firefox seu navegador
        else if (jQuery.browser.msie){
// Seu código aqui se for o Internet Explorer
        else if (jQuery.browser.safari){
// Seu código aqui se for o Safari
        else if (jQuery.browser.opera){
     // Seu código aqui se for Opera
        } else {
// Seu código aqui
        });

se quiser de uma olhada http://api.jquery.com/jquery.browser/

Só fica atento que caso o navegador for o chrome, ele cai no mesmo if que o Safari, pois ambos utilizam a mesma engine, a web kit.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Similar Content

    • By lezão
      Ola pessoal!
      Td bem com vcs?
       
      Estou tentando fazer esse item ficar em css e naun estou conseguindo alguem pode me ajudar?
      <table width="75%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="15%" height="35"><b>Moda da Casa</b></td> <td width="55%" style="border-bottom: dotted; border-width: 1px 3px 3px 1px; border-color: black black #000000 #000000"></td> <td width="7%"><b>R$ 25,00</b></td> <td width="3%" rowspan="2" align="left"><img src="https://clipartart.com/images/delete-button-clipart.jpg" width="75px" heigth="50px"/></td> </tr> <tr> <td colspan="3" height="35"> <div class="label-float"> <input type="text" value="Molho de tomate, mussarela, calabresa ralada, catupiry, alho tostado, cebola, azeitonas e oregano." size="100%" placeholder="" required=""> </div> </td> </tr> </table> obrigado!
       
       
       
    • By Carcleo
      Estou a um tempo tentando criar um slider personalizado.
      De fato, eu até consegui e coloquei no codepen. https://codepen.io/carcleo/pen/yLVOxMv
       
      Mas uma implementação não estou conseguindo fazer.
       
      Nos sliders prontos que pegamos na web, ao redimencionar manualmente o navegador,   a UL que abriga as LI's com os Slides, se redimenciona junto e isso não acontece com o meu, Isto é, ao diminuir a janela do navegador, as imagens acompanham o tamanho das LIs, mas como não consigo redimencinar a UL junto os slides acabam se mostrando de forma errada. 
       
      Não consegui uma forma de fazer o CSS fazer esse serviço. Só consegui com JS.
       
      Se alguém puder ajudar?
       
      Obs.: não quero copiar da internet, meu objetivo é entender a logica da coisa
    • By PedroHRLeite
      Estou querendo deixar um rodapé fixo no topo a medida que o mesmo alcança o topo da página, porém estou encontrando dificuldades ao utilizar position: sticky, segue o código completo, se eu colocar a configuração de sticky na classe .side-column funciona bem, porém quero apenas no footer, alguém saber como resolver?
      <!DOCTYPE html> <html> <head> <style> .wideBody .side-column { float: right; order: 2; width: 300px; } .wideBody .side-column footer { position: sticky; position: -webkit-sticky; top: 0; } .wideBody .main-column { align-self: flex-start; float: left; width: 500px; border: 2px solid #4CAF50; } .resultados { border: 2px solid #4CAF50; margin-bottom:25px; position:relative; } footer { border: 2px solid #4CAF50; } </style> </head> <body class="wideBody"> <main> <div> <div class="main-column"> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> coluna principal<br /> </div> <aside class="side-column"> coluna auxiliar <div class="resultados"> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> 1 -> 2<br /> </div> <footer> rodape fixo </footer> </aside> </div> </main> </body> </html>  
    • By Vanderson Bilck Barbosa
      Boa tarde;
      Busco ajuda com um assunto não muito comum e que já esta me tirando o sono a 2 dias....
      Estou gerando PDFs com o DOMPDF, porém alguns itens que são cadastrados no banco via TextArea não se alinham conforme o restante dos demais.
       
      *** Ressalto que já tentei todas as formas de alinhamento CSS possíveis, tanto diretamente no item quanto no css integrado, limpei os itens no textarea (https://summernote.org/) que são adicionados automático (exemplo: <p></p> ).
       
      1 - Arquivo que busca o arquivo já renderizado .php.
      <?php
      use Dompdf\Dompdf;
      $dompdf = new Dompdf(["enable_remote" => true]);
      $dompdf->setPaper('A4', 'portrait');
      ob_start();
      require "views/adm/ordemdeproducao.php";
      $dompdf->loadHtml(ob_get_clean());
      $datagera = date('dmY-His');
      $dompdf->render();
      $dompdf->stream("OrdemProducao_$datagera.pdf", array("Attachment" => false));
       
      2 - trecho do Arquivo que é chamado pelo anterior
                                 <tr style="background-color: #FFFFFF;">
                                      <td>
                                          <table>
                                              <tr>
                                                  <td class="bglaranja1 th titReceita">
                                                      <b>RECEITA:</b> <i><?php echo $receita->gettitulo(); ?></i>
                                                  </td>
                                              </tr>
                                          </table>
                                          <table>
                                              <thead>
                                                  <tr>
                                                      <th class="th" width="60">ITEM</th>
                                                      <th class="th">PRODUTO</th>
                                                      <th class="th" width="60">UN</th>
                                                      <th class="th" width="60">QTDE</th>
                                                  </tr>
                                              </thead>
                                              <tbody>
                                                  <?php
                                                  $receitaItem = new Receita();
                                                  $itensReceita = $receitaItem->getProdutoReceita(array($receita->gettoken()));
                                                  foreach ($itensReceita as $itemCalc) {
                                                  ?>
                                                      <tr class="small">
                                                          <td class="text-center td"><?php echo $itemCalc["id_produto"]; ?></td>
                                                          <td class="td"><?php echo $itemCalc["nome_produto"]; ?></td>
                                                          <td class="text-center td"><?php echo $itemCalc["um_produto"]; ?></td>
                                                          <td class="text-center td"><?php echo number_format(intval($valueCardapio["quantidade"]) * floatval($itemCalc["quantidade"]), 0, '', '.'); ?></td>
                                                      </tr>
                                                  <?php } ?>
                                              </tbody>
                                          </table>
                                          <table style="background-color: #FFFFFF;">
                                              <tr>
                                                  <td class="td small" valign="top">
                                                      <p style="left: 0; text-align: left; margin-left: 0; border: 1px solid #FF0000;">
                                                          <b>MATERIAIS DA RECEITA</b><br />
                                                          <?php echo $receita->getmateriais(); ?>  //item que não se alinha (left) como os demais
                                                      </p>
                                                  </td>
                                              </tr>
                                          </table>
                                          <table>
                                              <tr>
                                                  <td class="td small" valign="top" style="background-color: #FFFFFF;">
                                                      <p style="left: 0; text-align: left; margin-left: 0; border: 1px solid #FF0000;">
                                                          <b>MODO DE PREPARO</b><br />
                                                          <?php echo $receita->getmodo_preparo(); ?> //item que não se alinha (left) como os demais
                                                      </p>
                                                  </td>
                                                  <td class="td small" valign="top" style="background-color: #FFFFFF; width: 160px;">
                                                      <b>FOTO DA RECEITA</b><br />
                                                      <?php if ($receita->gettoken_img() == null) { ?>
                                                          <div class="image_receita" style="background-image: url('<? echo $urlFora;?>/views/adm/res/img/noimage-300.jpg')"></div>
                                                      <?php } else { ?>
                                                          <div class="image_receita" style="background-image: url('<? echo $urlFora;?>/img/<?php echo $receita->gettoken_img(); ?>/0/1')"></div>
                                                      <?php } ?>
                                                  </td>
                                              </tr>
                                          </table>
                                          <table class="mb-1">
                                              <tr>
                                                  <td class="td small">
                                                      <b>Tempo de Preparo:</b> <?php echo $receita->gettempo_preparo(); ?> Minutos</td>
                                                  <td class="td small">
                                                      <b>Rendimento:</b> <?php echo $receita->getrendimento(); ?>
                                                  </td>
                                              </tr>
                                              <tr>
                                                  <td class="td small">
                                                      <b>Tipo da Porção:</b>
                                                      <?php
                                                      $porcao = new Porcao();
                                                      $porcao->loadByIdAtivo($receita->gettb_porcao_id());
                                                      echo $porcao->getmedida_caseira();
                                                      ?>
                                                  </td>
                                                  <td class="td small">
                                                      <b>Medida da Porção (gramas): <?php echo $receita->getvalor_porcao(); ?></b>
                                                  </td>
                                              </tr>
                                          </table>
                                      </td>
                                  </tr>
       
      3 - arquivo gerado em pdf (Imagem Anexo) - Itens vermelhos, são os mesmos comentados no fonte acima //item que não se alinha (left) como os demais

       
    • By jacquesvaladares
      Como inserir uma imagem como background em uma célula de tabela. Fiz um exemplo simples q apresento abaixo.
       
      <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
      <html>
      <head>
        <meta http-equiv="content-type"
       content="text/html; charset=ISO-8859-1">
        <title>Teste de imagem na celula da tabela</title>
      <!--&#8211; I N I C I O C S S &#8211;-->
        <style type="" text/css="">
      .imagem{
      background: url(liz.png) no repeat;
      }
        </style><!--&#8211; F I M C S S &#8211;-->
      </head>
      <body>
      <table
       style="width: 100%; height: 450px; text-align: left; margin-left: auto; margin-right: auto;"
       border="2" cellpadding="2" cellspacing="2">
        <tbody>
          <tr>
            <td style="height: 50%; width: 50%;"><class
       ="imagem"></class></td>
            <td
       style="height: 50%; width: 50%; background-color: rgb(255, 255, 204);"></td>
          </tr>
          <tr>
            <td
       style="height: 50%; width: 50%; background-color: rgb(51, 102, 255);"></td>
            <td
       style="height: 50%; width: 50%; background-color: rgb(51, 255, 51);"></td>
          </tr>
        </tbody>
      </table>
      <br>
      </body>
      </html>
       

×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.