Блог

Главная - Вопросы по программированию - react-responsive-carousel: как присвоить фиксированную высоту thumb?

react-responsive-carousel: как присвоить фиксированную высоту thumb?

#javascript #css #reactjs #carousel #tailwind-css

#javascript #css #reactjs #карусель #попутный ветер-css

Вопрос:

Я задал фиксированную высоту изображению. но проблема в том, что теперь высота также применяется в больших пальцах. Как я могу это предотвратить?

 <Carousel width="600px" dynamicHeight={false}>
  {data?.book?.images.map((image, i) => (
    <img src={image} alt={`${i}`} className="h-128" />
  ))}
</Carousel>;

Ответ №1:

Вы можете обернуть изображение div. и присвоить этому div фиксированную высоту. после этого на изображении вы можете указать высоту: 100%. Таким образом, высота будет применяться только к изображению. Это не будет применяться к большим пальцам.

 <Carousel width="600px" dynamicHeight={false}>
  {data?.book?.images.map((image, i) => (
    <div className="h-128">
      <img src={image} alt={`${i}`} className="h-full" />
    </div>
  ))}
</Carousel>;