Chamando CSS apenas quando for mobile
28/03/2019
0
Gostaria de chamar as linhas de css somente quando for mobile.
Como posso fazer?
Como posso fazer?
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap-theme.min.css"> <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css"> <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"> <script type="text/javascript" src="bootstrap/js/npm.js"></script> <link rel="stylesheet" type="text/css" href="css/principal.css">
Samuel Lopes
Curtir tópico
+ 0
Responder
Posts
29/03/2019
Vinnicius Gomes
Gostaria de chamar as linhas de css somente quando for mobile.
Como posso fazer?
Como posso fazer?
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap-theme.min.css"> <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css"> <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"> <script type="text/javascript" src="bootstrap/js/npm.js"></script> <link rel="stylesheet" type="text/css" href="css/principal.css">
Bom dia Samuel!
Você pode fazer uma verificação com o PHP
<?php $iphone = strpos($_SERVER['HTTP_USER_AGENT'],"iPhone"); $android = strpos($_SERVER['HTTP_USER_AGENT'],"Android"); $palmpre = strpos($_SERVER['HTTP_USER_AGENT'],"webOS"); $berry = strpos($_SERVER['HTTP_USER_AGENT'],"BlackBerry"); $ipod = strpos($_SERVER['HTTP_USER_AGENT'],"iPod"); // Verificando se é mobile if ($iphone || $android || $palmpre || $ipod || $berry == true) { echo "<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap-theme.min.css"> <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css"> "; } else { echo "<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"> <script type="text/javascript" src="bootstrap/js/npm.js"></script> <link rel="stylesheet" type="text/css" href="css/principal.css">"; } ?>
Esse código você pode integrar dentro da tag <head></head>
Responder
29/03/2019
Bruno Pardim
Iaew cara,
No seu código css você pode chamar um estilo especifico somente para mobile com isso por exemplo:
Neste caso a MinhaClasse vai ser carregada se meu dispositivo atender essa condição: max-width: 480px
@media (max-width: 480px) {
.MinhaClasse
{
.......
}
}
Dá para melhorar o paramentro, da uma olhada em:
https://getbootstrap.com/docs/4.3/layout/overview/
No seu código css você pode chamar um estilo especifico somente para mobile com isso por exemplo:
Neste caso a MinhaClasse vai ser carregada se meu dispositivo atender essa condição: max-width: 480px
@media (max-width: 480px) {
.MinhaClasse
{
.......
}
}
Dá para melhorar o paramentro, da uma olhada em:
https://getbootstrap.com/docs/4.3/layout/overview/
Responder
Clique aqui para fazer login e interagir na Comunidade :)