Rendre un site web "responsive"
zellfurath
Messages postés
200
Date d'inscription
Statut
Membre
Dernière intervention
-
zellfurath Messages postés 200 Date d'inscription Statut Membre Dernière intervention -
zellfurath Messages postés 200 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Bonjour,
voila, je dois rendre un site web existant responsive mais ne sachant pas faire je vais créer un css par suports.
j'aimerai savoir si il y aurait un script qui détecte le suport (i-pad, iphone, pc...)
et qui chargerai le css qui aura été conçu pour.
je vous remerci d'avance pour vos réponses :)
Bonjour,
voila, je dois rendre un site web existant responsive mais ne sachant pas faire je vais créer un css par suports.
j'aimerai savoir si il y aurait un script qui détecte le suport (i-pad, iphone, pc...)
et qui chargerai le css qui aura été conçu pour.
je vous remerci d'avance pour vos réponses :)
A voir également:
- Rendre un site responsive html/css
- Site de telechargement - Accueil - Outils
- Site comme coco - Accueil - Réseaux sociaux
- Quel site remplace coco - Accueil - Réseaux sociaux
- Site x - Guide
- Site pour vendre des objets d'occasion - Guide
4 réponses
Salut, tu peux utiliser les media queries
http://css.mammouthland.net/css3/media-queries.php
Bonne chance
http://css.mammouthland.net/css3/media-queries.php
Bonne chance
Bonjour,
Je ne sais pas si c'est la meilleure solution, mais tu peux utiliser du JavaScript pour détecter la résolution d'écran et utiliser un CSS différent en fonction de cette résolution : https://www.commentcamarche.net/faq/849-php-detecter-la-resolution-d-affichage
Je ne sais pas si c'est la meilleure solution, mais tu peux utiliser du JavaScript pour détecter la résolution d'écran et utiliser un CSS différent en fonction de cette résolution : https://www.commentcamarche.net/faq/849-php-detecter-la-resolution-d-affichage
merci pour les réponses ! :) les media query sont deja dans mon script css :
@media all and (max-width: 320px) {
body {
-moz-transform: scale(0.25);
-webkit-transform: scale(0.25);
transform: scale(0.25);
-moz-transform-origin: 0;
-webkit-transform-origin: top;
transform-origin: top;
}
}
@media all and (min-width: 321px) and (max-width: 480px) {
body {
-moz-transform: scale(0.3);
-webkit-transform: scale(0.3);
transform: scale(0.3);
-moz-transform-origin: 0;
-webkit-transform-origin: top;
transform-origin: top;
}
}
@media all and (min-width: 481px) and (max-width: 768px) {
body {
-moz-transform: scale(0.45);
-webkit-transform: scale(0.45);
transform: scale(0.45);
-moz-transform-origin: 0;
-webkit-transform-origin: top;
transform-origin: top;
}
}
@media all and (min-width: 769px)and (max-width: 960px) {
body {
-moz-transform: scale(0.55);
-webkit-transform: scale(0.55);
transform: scale(0.55);
-moz-transform-origin: 0;
-webkit-transform-origin: top;
transform-origin: top;
}
}
mais sur ipad le site n'est pas centré il est collé a gauche ET je suis pas en php mais en html :s
@media all and (max-width: 320px) {
body {
-moz-transform: scale(0.25);
-webkit-transform: scale(0.25);
transform: scale(0.25);
-moz-transform-origin: 0;
-webkit-transform-origin: top;
transform-origin: top;
}
}
@media all and (min-width: 321px) and (max-width: 480px) {
body {
-moz-transform: scale(0.3);
-webkit-transform: scale(0.3);
transform: scale(0.3);
-moz-transform-origin: 0;
-webkit-transform-origin: top;
transform-origin: top;
}
}
@media all and (min-width: 481px) and (max-width: 768px) {
body {
-moz-transform: scale(0.45);
-webkit-transform: scale(0.45);
transform: scale(0.45);
-moz-transform-origin: 0;
-webkit-transform-origin: top;
transform-origin: top;
}
}
@media all and (min-width: 769px)and (max-width: 960px) {
body {
-moz-transform: scale(0.55);
-webkit-transform: scale(0.55);
transform: scale(0.55);
-moz-transform-origin: 0;
-webkit-transform-origin: top;
transform-origin: top;
}
}
mais sur ipad le site n'est pas centré il est collé a gauche ET je suis pas en php mais en html :s