Créer une fenêtre modale en pur CSS avec la pseudo-classe :target

Vous connaissez forcément les fenêtres modales, même s’il est possible d’ignorer que ça porte ce nom : ce sont ces petites fenêtres qui s’ouvrent lorsque vous cliquez sur un lien ou un bouton par exemple et qui vous permettent diverses choses comme indiquer votre adresse e-mail ou plein d’autres trucs. Les fenêtres modales ont évolué […]

Responsive design : Redimensionner une image avec CSS en conservant le ratio

Nous avons déjà plusieurs fois parlé de responsive design en abordant les Media Queries et le viewport. Seulement, que se passe-t-il si vous faites en sorte que votre design s’adapte en fonction de la résolution du visiteur mais que ce dernier arrive avec un terminal d’une largeur de 500 pixels alors qu’une image de votre […]

Responsive design : le viewport

Comme nous l’avions évoqué précédemment lors de l’introduction des Media Queries, ces dernières ne font pas tout dans le responsive design et ainsi, on peut constater que sur pas mal de smartphones (par exemple), les Media Queries ne semblent avoir aucun effet… Ce qui peut paraître étrange et surtout extrêmement gênant : si on fait […]

Reponsive design : les Media Queries

Avant, créer un webdesign, c’était simplement créer l’interface pour les écrans d’ordinateurs. Il y avait plusieurs contraintes, notamment la gestion des différents navigateurs, mais on devait aussi faire avec les différentes résolutions existantes. Aujourd’hui, c’est toujours le cas, mais le problème des résolutions est devenu encore plus important avec l’avènement de la navigation mobile. C’est […]

Les images de fond multiples avec CSS3

Le CSS3 apporte beaucoup de nouveautés dont un certain nombre était attendu depuis longtemps. Parmi celles-ci, la possibilité de mettre plusieurs images de fond sur un seul élément. Nous allons voir ici comment faire avant de voir un exemple d’utilisation de la chose. Pour les plus impatients d’entre vous, voici directement la syntaxe de cette […]

Des triangles en CSS

Le Full-CSS se développe de plus en plus et consiste à remplacer le plus grand nombre possible d’images (idéalement la totalité) de votre site par du simple CSS. L’avantage certain est le temps de chargement plus rapide, mais en contrepartie, il faudra user de certaines astuces pour dessiner certaines parties… Nous allons voir ici comment […]

Créer des images de fond cliquables

Faire en sorte qu’une image soit cliquable n’a rien de compliqué : il suffit de l’insérer dans un lien. Le problème survient si vous voulez que ce soit une image de fond qui soit cliquable : en gros, nous allons voir comment créer des liens « vides » ! Mais pas n’importe comment, il faut penser à […]