Blog d'aide de Blog4ever

Blog d'aide de Blog4ever

Conseil / aide pour adapté son site sur smartphone et tablette ?

0 appréciations
Hors-ligne
:bd:, auriez vous des conseil pour cette amélioration, des codes etcc ? je suis preneur :D :b2:
undertaker catch la passion du catch

0 appréciations
Hors-ligne
:b1:  Nana aucun code possible pour cela je pense ? il faut juste que je remettre la taille du contenu de base ? merci
undertaker catch la passion du catch

20 appréciations
Hors-ligne
Bonsoir 


C'est totalement possible NeroCa  ! 
Regarde mon site il est adapté aux mobiles et pourtant le css est trafiqué comme pas possible lol 

Il faut simplement créer des règles dans le css  pour des résolutions d'écran inférieur à 979px 
En gros tu dois avoir ton code css pour ton blog version ordi et ton code css pour ta version mobile. 

dans ton css il faut ajouter la balise suivante 


@media screen and (max-width: 979px)  {  



 ici ton code css pour ta page mobile (taille de page, des titres etc.)

ex : 
  .cssmenup {
 width : 100%;
 border: 2px solid black;
 height: auto;
}  }   




ps : toujours utiliser des % et non des px pour la largeur des objets, par exemple la page en mobile ne doit pas faire 900px mais 100% pour qu'elle s'adapte parfaitement.


Attention : si tu veux un beau rendu tu devras  faire des menus spécifiques pour la version mobile en htlm, ajouter des chose ou masquer des menus de la version pour ordinateur (moi j'ai fait des menus distinct, tu peux faire des menus qui fonctionne pour les 2 versions mais ca me parait plus compliqué à faire)  

pour masquer des objets visibles sur la version ordinateur il faut utiliser un truc du genre :  


@media screen and (min-width: 980px) {  


  .cssmenup { 
display: none;

}  }


J'espère que ça peut t'aider. Si tu veux je peux chercher sur le net pour retrouver les site qui m'ont aider à adapter mon site aux mobiles 

Dernière modification le mardi 06 Mars 2018 à 19:57:34

20 appréciations
Hors-ligne
Bonjour Nana


En fait ma méthode laisse la version "ordinateur" du blog intacte. Le code que je propose permet de shunter les "normes" établies dans le css de la version "ordinateur" pour la remplacer par un css adapter à une version mobile.


Ce n'est pas une question de largeur de page, qu'elle fasse 1000px  1320px ou 2500px  le principe reste le même.
Moi j'ai mis 979px car mon blog fait 1000px en version ordinateur, pour Nero CA ce n'est pas 979px mais 1300px qu'il faut mettre. 

Dans ce css adapté aux mobiles les largeurs de pages, de menu etc. ne sont plus en pixel mais en pourcentage ce qui permet d'être adapté aux différentes résolution de smartphone. Du coup peut importe la largeur du blog à la base, au pire ces articles en version mobile seront moins "design" :)


En plus il n'a pas de menu latéral,  il a un seul menu. Si il est motivé il peut le rendre adapté aux mobiles.
Ce sujet est fermé, vous ne pouvez pas y répondre.
Vous ne disposez pas des permissions nécessaires pour répondre à un sujet de la catégorie Demandes de conseils.

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 6065 autres membres