Inspecter le modèle de boîte d'un élément facilement avec XRAY

Avez-vous déjà voulu connaître la taille exacte d'un certain élément dans une page Web comme le remplissage, la marge, la position et ainsi de suite? Habituellement, vous pouvez obtenir l'information en utilisant un outil d'inspection Web; la plupart des navigateurs ont des outils intégrés pour vous aider à le faire. Alternativement, vous pouvez utiliser Firebug, qui est également un outil web très populaire. Lorsque les choses se compliquent cependant, peut-être que vous avez besoin de se rabattre sur un outil comme XRAY.

XRAY est un outil gratuit multi-navigateur qui vous permet de voir le modèle de boîte pour n'importe quel élément d'une page Web directement dans votre navigateur. Contrairement à d'autres outils d'inspection Web complexes, XRAY se concentre sur vous donner des informations complètes sur le modèle de boîte de l'élément.

Commencer

XRAY est un bookmarklet. Pour l'utiliser, faites glisser XRAY dans la barre de favoris de votre navigateur préféré. XRAY est disponible pour les navigateurs IE6 +, Webkit et Mozilla comme Safari et Firefox.

Tout comme les autres bookmarklets, XRAY ne peut pas fonctionner si le protocole SSL (HTTPS) est appliqué .

Inspection des éléments

Pour commencer l'inspection, ouvrez une page Web que vous souhaitez inspecter, assurez-vous qu'elle est complètement chargée et appuyez sur le signet XRAY. Vous obtiendrez une nouvelle fenêtre contextuelle dans votre navigateur. Cette boîte affichera toutes les informations sur l'élément que vous avez sélectionné.

Utilisons mon inspection de la page d'accueil XRAY comme exemple. Dites que je veux connaître les informations du modèle de boîte de l'élément suivant.

Je clique sur XRAY dans la barre de favoris, et sélectionne l'élément. Cela me donne le nom, l'identifiant, la classe, la hiérarchie, la position, le remplissage, la bordure et la marge de l' élément .

Pour fermer la boîte, appuyez simplement sur le bouton X dans le coin supérieur droit de la boîte ou rafraîchissez votre page pour quitter l'outil.

Pensée finale

Mis à part sa fonction d'inspection de modèle de boîte avancée, XRAY ne vous fournit pas les informations généralement disponibles dans d'autres outils d'inspection Web, comme le style ou DOM . Quoi qu'il en soit, c'est toujours un outil très utile et facile à utiliser pour une utilisation quotidienne.

18 utilisations créatives de la typographie dans les jeux vidéo

Il y a un argument à savoir si les jeux vidéo devraient être considérés comme une forme d'art. Peu importe de quel côté vous êtes, on ne peut nier que les jeux vidéo intègrent plusieurs formes d'art dans leur récit et leur gameplay dans le cadre de l'intrigue, de la direction artistique ou de l'audio.Les jeux v

(Conseils techniques et de conception)

Comment vivre à travers une batterie mourante sur Android

La vie courte de la batterie est l'une des plus grandes chutes des téléphones Android, et il y a des moments où vous ne pouvez pas avoir accès à un point de charge lorsque vient ce moment redouté. Dans une telle situation, nous connaissons des moyens pratiques pour réduire l'utilisation de la batterie et permettre à votre téléphone de survivre avec une batterie faible pendant un certain temps.Bien qu&#

(Conseils techniques et de conception)