La liste des composants de la carte REACT Antd affiche l'exception: Pourquoi l'effet transparent apparaît-il dans Safari?

React Antd Card Component Affiche des exceptions sous Safari: Liste Analyse des effets transparents

Lorsque vous utilisez le composant de carte d'Ant Design pour nicher les composants des onglets et inclure des composants de liste, une exception qui n'apparaît que dans Safari: lorsqu'il y a plus de 5 éléments de liste, le composant de carte a un effet visuel transparent ou de type fantôme. Ce n'est pas complètement transparent, mais une illusion visuelle causée par un affichage de contenu incomplet.

Ce problème peut provenir du fait que le composant de la carte n'est pas suffisamment large pour s'adapter à tous les éléments de la liste, ce qui fait débarquer le contenu et être obscurci ou caché. Il est recommandé de vérifier si le composant de la liste prend en charge le défilement ou la traînée horizontaux. Cet effet visuel "transparent" sera produit si le contenu dépasse la largeur du composant de la carte.

De plus, le style d'ombre du composant de carte lui-même peut également être amplifié lorsque le contenu déborde, exacerbant ce malentendu visuel. Il est recommandé de cocher le style CSS du composant de la carte, en particulier des propriétés liées à l'ombre telles que box-shadow et essayer de s'adapter pour résoudre le problème. Envisagez d'utiliser overflow: auto; ou overflow-x: auto; Pour permettre le défilement horizontal ou ajuster la largeur du composant de la carte pour ajuster le contenu de la liste.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!