Icône du lab

Fine Print

Que cache réellement la clause en petits caractères ?

Défi Mis à jour le 21 juin 2026 Solution (Pro)
CSS Media Queries Web Forensics Source Analysis DevTools

Le document de conformité d'entreprise de CipherCorp ressemble à du jargon juridique standard. Mais enfoui dans la feuille de style, une media query CSS dissimule un mémo interne confidentiel qui n'apparaît que dans un contexte de rendu différent. Pouvez-vous lire entre les lignes et trouver ce qui n'était jamais censé être vu à l'écran ?

1
Flags
50
XP
85%
Taux de Réussite

Les media queries CSS sont une fonctionnalité puissante du design web moderne qui contrôle la façon dont le contenu est rendu en fonction des caractéristiques de l'appareil, de la taille de l'écran et du support de sortie. Bien que principalement utilisées pour le design responsive, les media queries peuvent aussi masquer ou révéler du contenu selon le contexte de rendu - un comportement qui a des implications intéressantes pour la sécurité web et l'investigation numérique. Comprendre comment le CSS peut afficher conditionnellement du contenu est une compétence importante pour les professionnels de la sécurité qui inspectent les applications web.

Comprendre les media queries CSS

Les media queries CSS permettent aux développeurs d'appliquer différents styles en fonction de conditions comme la largeur de l'écran, le type d'appareil, l'orientation et, surtout, le type de média. La règle @media print applique des styles uniquement lorsqu'une page est imprimée ou rendue en aperçu avant impression. La règle @media screen applique des styles uniquement pour l'affichage à l'écran. Cela signifie que du contenu peut être complètement masqué à l'écran mais visible à l'impression, ou vice versa. Les propriétés comme display: none et visibility: hidden sont couramment utilisées pour basculer la visibilité du contenu entre les types de médias.

Contenu caché dans les pages web

Les pages web peuvent contenir beaucoup plus de contenu que ce qui est visible à l'écran. Au-delà des media queries, le contenu peut être masqué en utilisant des propriétés CSS (opacity: 0, overflow: hidden, positionnement hors écran), des attributs HTML (hidden), ou une visibilité contrôlée par JavaScript. Lors des évaluations de sécurité, les analystes doivent examiner non seulement la page visible mais le code source complet et les styles calculés pour identifier tout le contenu que la page contient. Les outils de développement du navigateur permettent d'émuler différents types de médias et de basculer les propriétés CSS pour révéler les éléments cachés.

Investigation numérique et analyse du source

L'investigation numérique des pages web implique l'examen du code source HTML, des feuilles de style CSS, du JavaScript et des requêtes réseau pour comprendre tout ce qu'une page contient et communique. Cela inclut l'analyse des feuilles de style intégrées et externes pour les règles d'affichage conditionnel, l'inspection des commentaires HTML pour les notes de développeur ou le contenu oublié, et l'examen du JavaScript pour les données chargées dynamiquement ou cachées. Ces techniques médico-légales sont utilisées dans la réponse aux incidents, le renseignement sur les menaces et les enquêtes juridiques impliquant des preuves basées sur le web.

Ce que vous apprendrez

  • Comment les media queries CSS contrôlent le rendu du contenu selon le contexte
  • Utilisation des outils de développement du navigateur pour émuler différents types de médias
  • Techniques de découverte de contenu caché dans les pages web
  • Propriétés CSS utilisées pour afficher ou masquer conditionnellement des éléments
  • Méthodes d'investigation numérique pour l'analyse du code source des pages

Prérequis

Basic HTML and CSS knowledge Browser developer tools No security experience required

Prêt à hacker ce lab ?

Créez un compte gratuit et pratiquez la cybersécurité.

Commencer - C'est gratuit
Commencez Votre Défi
~1-2 min de configuration
Serveur dédié
Instance privée
Puissance standard
Nouveau ? Voici comment faire
1
Cliquez sur "Start Lab" ci-dessus Vous obtiendrez votre propre machine avec une adresse IP
2
Explorez la cible Ouvrez l'IP dans votre navigateur et cherchez des vulnérabilités
3
Trouvez et soumettez les flags Les flags sont des textes secrets cachés dans le système - collez-les ci-dessous pour marquer des XP

Prêt à hacker ce lab?

Créez un compte gratuit pour démarrer votre propre serveur dédié, soumettre des flags et gagner des XP au classement.

Commencer à Hacker Gratuitement
13 000+ Hackers 100+ Labs & Cours Gratuit
Commencer Gratuitement