web-dev-qa-db-fra.com

Comment charger en dernier la nouvelle feuille de style CSS personnalisée de Protostar?

J'utilisais EasyScript pour charger du code CSS personnalisé sur un site Web à l'aide du modèle Protostar:

EasyScript Custom CSS

Cela fonctionne bien et me permet de remplacer le style du modèle et celui des extensions tierces (par exemple, AcyMailing, CoalaWeb Social Links et Smart Slider dans ce cas particulier) car le code CSS personnalisé est chargé en dernier.

Depuis Joomla 3.5.0, le modèle Protostar charge le code CSS personnalisé à partir du fichier situé à /templates/protostar/css/user.css, Si le fichier existe.

Malheureusement, le CSS personnalisé est chargé immédiatement après le fichier Protostar template.css. Par conséquent, je ne peux pas utiliser cette fonctionnalité pour remplacer le style d'extension tiers:

Protostar User CSS

Comme je tiens à minimiser le nombre d'extensions tierces que je dois charger, comment puis-je charger user.css Après les feuilles de style des extensions tierces?

joomla-3.xtemplates
5
Neil Robertson

Une option consiste à utiliser un sélecteur plus puissant. Avec cela, la position de l'ordre du css n'a pas d'importance.

si vous souhaitez modifier le css original

    .theComponent .theSelector {
    color:red;
    }

utilisation

    html .theComponent .theSelector {
    color:blue;
    }
3
Pierre-André Vullioud

Ce que @Pierre suggère est appelé CSS Specificity , et joue un rôle important dans la détermination du sélecteur CSS le plus puissant.

Il peut être facilement calculé avec Calculatrice de la spécificité , mais le sélecteur le plus puissant html qu'il suggère, fonctionnera toujours pour remplacer les attributs précédemment appliqués.

3
user8036