Bonjour ou bonsoir,
Je suis débutant en création de site web et j'aimerais adapter mon site aux diverses résolutions d écrans que les utilisateurs peuvent avoir.
Je travail sur Wordpress et me suis créer un Theme vierge avec Artister.
J’ai visité plusieurs forums et tutoriel et pense m'approcher de mon but mais n'y suis pas encore.
Donc je sais qu'il y a plusieurs façon de s y prendre.
les Medias Queries par ex.
Pour commencer je voulais juste modifier l'image de fond de mon header qui se trouve dans .art-header dans mon fichier style.css.
Je voulais la remplacer par une autre image quand la résolution de l'écran sera réduite ou que l'on diminue la fenêtre.
Voici le code media queries a coller en bas du fichier style.css :
J'ai donc essayé de l'appliquer dans mon cas:
Cela ne marche pas.
J'ai essayé d'autre choses mais je vous laisse les liens ci dessous sur d' autres forum ou j'ai vraiment tout détaillé avec mon fichier style.css en entier:
http://forum.creer-un-site.fr/creer-un-site-828-besoin-aide-adapter-site-diverses-resolutions-ecrans
http://techutile.wordpress.com/2012/02/20/changer-le-background-en-fonction-de-la-resolution-decran/
Un grand merci à vous d'avance.
Je suis bloqué depuis plusieurs mois à cause de ce problème d'adaptation d'affichage!
Modifié par kalounne (21 Mar 2014 - 23:27)
Je suis débutant en création de site web et j'aimerais adapter mon site aux diverses résolutions d écrans que les utilisateurs peuvent avoir.
Je travail sur Wordpress et me suis créer un Theme vierge avec Artister.
J’ai visité plusieurs forums et tutoriel et pense m'approcher de mon but mais n'y suis pas encore.
Donc je sais qu'il y a plusieurs façon de s y prendre.
les Medias Queries par ex.
Pour commencer je voulais juste modifier l'image de fond de mon header qui se trouve dans .art-header dans mon fichier style.css.
.art-header {
background-image: url('images/header.png'); /* le background pour un navigateur dont la largeur est supérieure à 1280px */
background-position: center;
background-repeat: no-repeat;
background-attachment: scroll;
background-position: top full;
position: relative;
max-width: 100%;
height: 250px;
z-index: auto !important;
}
Je voulais la remplacer par une autre image quand la résolution de l'écran sera réduite ou que l'on diminue la fenêtre.
Voici le code media queries a coller en bas du fichier style.css :
@media screen and (max-width: 1024px) {
VotreCodeIci
}
J'ai donc essayé de l'appliquer dans mon cas:
@media screen and (max-width: 1280px) {
.art-header
{
background-image: url(‘images/cicig.png’); /* le background pour un navigateur dont la largeur est inférieur à 1280px */
}
}
Cela ne marche pas.
J'ai essayé d'autre choses mais je vous laisse les liens ci dessous sur d' autres forum ou j'ai vraiment tout détaillé avec mon fichier style.css en entier:
http://forum.creer-un-site.fr/creer-un-site-828-besoin-aide-adapter-site-diverses-resolutions-ecrans
http://techutile.wordpress.com/2012/02/20/changer-le-background-en-fonction-de-la-resolution-decran/
Un grand merci à vous d'avance.
Je suis bloqué depuis plusieurs mois à cause de ce problème d'adaptation d'affichage!
Modifié par kalounne (21 Mar 2014 - 23:27)