J'ai fouillé dans le node_module Ant-Design pour essayer de changer la couleur et la largeur par défaut d'un onglet actif, mais je n'ai pas eu de chance. Quelqu'un sait comment le contourner?
Le problème est que je ne sais pas par quel élément commence la bordure. Toute aide est la bienvenue.
3 Réponses :
Vérifiez https://pro.ant.design/docs/ style # Override-the-component-style pour savoir comment remplacer le style.
Référez-vous aussi à la réponse Antd: Comment remplacer le style d'une seule instance d'un composant
Pour déterminer ce qui doit être modifié par vous-même, inspectez l'élément dans le navigateur.
Vous devez utiliser les accessoires tabBarStyle .
Voir la documentation: https://ant.design/components/tabs/
vous pouvez utiliser:
.ant-tabs-ink-bar {
height: 5px;
background: red !important;
}
UPDATE
Ce style fonctionnera comme prévu.
.ant-tabs-tab.ant-tabs-tab-active {
border-bottom: 2px solid #BF2D30 !important;
z-index: 2;
}
Bien que ce code puisse répondre à la question, fournir un contexte supplémentaire sur la manière et / ou la raison pour laquelle il résout le problème améliorerait la valeur à long terme de la réponse.
ouais, pourquoi on met border-bottom ? il remplacera le style antd original et nous devrions ajouter z-index: 2 pour mettre notre style personnalisé devant le style original