web-dev-qa-db-fra.com

Chrome - désactiver tous les styles d'un fichier .css spécifique

Lors de l'inspection d'un site Web, est-il possible de désactiver un fichier .css particulier? Je peux le faire dans FireFox mais je ne trouve pas l'option dans Chrome.

38
pkr298

Si vous souhaitez supprimer le style pour le reste de la session de page, ouvrez l'inspecteur DOM, recherchez le <link> ou <style> élément qui relie la feuille de style et supprime l'élément. Cela entraîne la suppression de tous les styles associés.

Si vous ne souhaitez désactiver que temporairement la feuille de style, ajoutez un nouvel attribut disabled au <link>/<style> élément. Supprimez cet attribut pour réactiver la feuille de style.

Si le site contient de nombreux éléments DOM distrayants, vous pouvez également visiter la console et quelque chose comme document.styleSheets[0].disabled = true; (où 0 est l'index de l'élément style).

52
Rob W

Ceci est basé sur la réponse utile de Rob W

Collez simplement ce qui suit dans votre console et modifiez la valeur d'index en conséquence.

La première exécution désactivera la feuille de style et la seconde l'activera.

var stylesheetIndex = 0;
var action = document.styleSheets[stylesheetIndex].disabled === false ? "Disabled " : "Enabled ";
document.styleSheets[stylesheetIndex].disabled = !document.styleSheets[stylesheetIndex].disabled;
console.log( action + "stylesheet:" + document.styleSheets[stylesheetIndex].href );
3
Carlton

Une façon serait de trouver simplement:

<link rel="stylesheet" href="yourstyle.css" />

Et changez-le en autre chose ...

<link rel="stylesheet" href="yourstyleXXX.css" />

Ce qui l'empêcherait de fonctionner ...

Je parie qu'il y a un moyen d'utiliser les outils de développement ...

Le problème est que la plupart des gens concaténent et réduisent leur CSS avec des préprocesseurs ... vous ne pourrez donc pas adopter cette approche dans ces cas.

2
nouveau

Installez l'extension "Développeur Web" pour Chrome. Vous aurez alors diverses options, y compris le "Edit CSS", où vous pouvez apporter des modifications à n'importe quel fichier CSS à la volée (ou tout simplement supprimer complètement son contenu).

https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm

0
Artur Barseghyan