-
Conteúdo Similar
-
Por leonardorafaeldev
Boa noite pessoal estou com um problema que o icone do meu site não aparece no mobile segue uma foto do problema o meu codigo esta assim
<!-- icones --> <link href="icones/favicon.ico" rel="icon"> <link href="icones/favicon.ico" rel="shortcut icon"> <link rel="apple-touch-icon" sizes="57x57" href="icones/apple-icon-57x57.png"> <link rel="apple-touch-icon" sizes="60x60" href="icones/apple-icon-60x60.png"> <link rel="apple-touch-icon" sizes="72x72" href="icones/apple-icon-72x72.png"> <link rel="apple-touch-icon" sizes="76x76" href="icones/apple-icon-76x76.png"> <link rel="apple-touch-icon" sizes="114x114" href="icones/apple-icon-114x114.png"> <link rel="apple-touch-icon" sizes="120x120" href="icones/apple-icon-120x120.png"> <link rel="apple-touch-icon" sizes="144x144" href="icones/apple-icon-144x144.png"> <link rel="apple-touch-icon" sizes="152x152" href="icones/apple-icon-152x152.png"> <link rel="apple-touch-icon" sizes="180x180" href="icones/apple-icon-180x180.png"> <link rel="icon" type="image/png" sizes="192x192" href="icones/android-icon-192x192.png" > <link rel="icon" type="image/png" sizes="36x36" href="icones/android-icon-36x36.png"> <link rel="icon" type="image/png" sizes="48x48" href="icones/android-icon-48x48.png"> <link rel="icon" type="image/png" sizes="96x96" href="icones/android-icon-96x96.png"> <link rel="icon" type="image/png" sizes="144x144" href="icones/android-icon-144x144.png"> <link rel="icon" type="image/png" sizes="72x72" href="icones/android-icon-72x72.png"> <link rel="icon" type="image/png" sizes="32x32" href="icones/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="96x96" href="icones/favicon-96x96.png"> <link rel="icon" type="image/png" sizes="16x16" href="icones/favicon-16x16.png"> <link rel="manifest" href="icones/manifest.json"> <meta name="msapplication-TileColor" content="#ffffff"> <meta name="msapplication-TileImage" content="icones/ms-icon-144x144.png"> <meta name="theme-color" content="#ffffff"> <meta charset="utf-8"> <meta content="width=device-width, initial-scale=1.0" name="viewport"> -
Por phk
Olá.
Estou criando um site e já consegui fazer as fontes mudarem de tamanho, conforme o tamanho da tela. Se a tela do usuário for um celular, as fontes aumentam e ficam legíveis.
Agora preciso que determinados ícones em png, também aumentem da mesma forma, ficando legíveis em telas menores.
O código de uma das imagens é este:
<img style="width: 45px; height: 12px;" alt="" src="logomar.png"><br> Queria saber o que devo incluir para que quando a tela for menor que 480 pixel, a imagem dobre de tamanho.
Obrigado.
-
Por Gilberto Jr
Bom dia Pessoal;
Seguinte, eu criei o menu bootstrap segue o código abaixo. Quando eu estou vendo o site pelo celular, o menu vira um HAMBURGUER. Só que eu quero quando clicar no HAMBURGUER ele vira um X.
E quando eu clicar no link ele voltar para o HAMBURGUER.
<nav class="navbar navbar-default navbar-fixed-top"> <!--INICIO DIV CONTAINER ONDE VAI TODAS AS INFORMAÇÕES--> <div class="container-fluid containertop" id="topoinicio"> <div class="navbar-header"> <!--INICIO CONFIGURAÇÃO MENU HAMBERGUER--> <button type="button" class="navbar-toggle menuHamburguer" data-toggle="collapse" data-target="#menu-navegacao"> <span class="icon-bar top-bar"></span> <span class="icon-bar middle-bar"></span> <span class="icon-bar bottom-bar"></span> </button> <!--FIM CONFIGURAÇÃO MENU HAMBERGUER--> <!--INICIO LOGO MARCA--> <!--<a class="navbar-brand" href="#page-top"> <span class="iden">Iden</span> <span class="techonology">Technology</span> </a>--> <ol class="nav"> <ol class="menu" style="border:none;"> <a href="#home"> <img src="img/ico_3.png" class="img-responsive img-rounded imgLogo"> </a> </ol> </ol> <!--FIM LOGO MARCA--> </div> <!--INICIO MENU LINK--> <div class="collapse navbar-collapse menu-navegacao" id="menu-navegacao"> <ul class="nav navbar-nav navbar-right"> <li class="menu"> <a href="#home">HOME</a> </li> <li class="menu"> <a href="#solucoes">SOLUÇÕES</a> </li> <li class="menu"> <a href="#servicos">SERVIÇOS</a> </li> <li class="menu"> <a href="#empresa">EMPRESA</a> </li class="menu"> <li class="menu"> <a href="#localizacao">LOCALIZAÇÃO</a> </li> <li class="menu"> <a href="#contato">CONTATO</a> </li> <li class="abrirlink"> <a href="https://identechnology.tomticket.com?account=444224P07112016122136" title="Acessar Help Desk" target="_blank">TICKET<a> </li> </ul> </div> <!--FIM MENU LINK--> </div> <!--FIM DIV CONTAINER ONDE VAI TODAS AS INFORMAÇÕES--> </nav>
Eu tenho esse código abaixo CSS, que funciona um pouco. Só que o ele ja abre com o X.
<style type="text/css"> .navbar-toggle { border: none; background: transparent !important; } .navbar-toggle:hover { background: transparent !important; } .navbar-toggle .icon-bar { width: 22px; transition: all 0.2s; } .navbar-toggle .top-bar { transform: rotate(45deg); transform-origin: 10% 10%; } .navbar-toggle .middle-bar { opacity: 0; } .navbar-toggle .bottom-bar { transform: rotate(-45deg); transform-origin: 10% 90%; } .navbar-toggle.collapsed .top-bar { transform: rotate(0); } .navbar-toggle.collapsed .middle-bar { opacity: 1; } .navbar-toggle.collapsed .bottom-bar { transform: rotate(0); } </style>
Veja a imagem abaixo de quando eu entro no site. Ele entra com o X. E quando eu clico pela primeira vez no X, ele continua o x. E quando pela segunda vez clico no X ou clico em menu da lista ele volta para o HAMBURGUER.
Para ajudar, segue o link do site.
Iden Technology
-
Por Thiago ArteWeb
Olá pessoal, nessa vídeo-aula ensinarei como criar um FAVICON personalizado em COREL e DREAMWEAVER.
https://youtu.be/NCvlGRFgiAY
-
POWERED BY:
