So richten Sie diese Bilder horizontal aus und wenn ich ein anderes Bild hinzufüge, wird es Horizontaly hinzugefügt
Posted: 16 Feb 2025, 11:44
Ich versuche, einen Bildschieberer mit Namen und Beschreibung zu erstellen, aber wenn ich ein weiteres Bild hinzufüge, habe ich vertikal versucht, das Display zu ändern, aber nichts passiert, kann man mir bei diesem nur neu in CSS und HTML helfen.
Ich möchte diese Art von Bildschieberegler
Bildbeschreibung hier eingeben
, aber stattdessen tritt dies
Bildbeschreibung hier ein < /p>
was ich jetzt habe: < /p>
.services {
position: relative;
overflow: hidden;
padding: 20px;
}
.services-container {
padding: 0 10vw;
display: flex;
overflow-x: auto;
scroll-behavior: smooth;
}
.services-container::-webkit-scrollbar {
display: none;
}
.service-card {
flex: auto;
display: inline-block;
width: 300px;
height: 450px;
text-align: center;
margin-right: 40px;
}
.service-image {
position: relative;
overflow: hidden;
height: 350px;
width: 100%;
}
.service-thumb {
width: 100%;
height: 100%;
object-fit: cover;
}< /code>



Anti Acne
Description

Anti Aging
Description
< /code>
< /div>
< /div>
< /p>
Ich habe eine andere Anzeige ausprobiert, aber nichts passiert, es erscheint nur das Bild und Es passt nicht zum Behälter
Ich möchte diese Art von Bildschieberegler
Bildbeschreibung hier eingeben
, aber stattdessen tritt dies
Bildbeschreibung hier ein < /p>
was ich jetzt habe: < /p>
.services {
position: relative;
overflow: hidden;
padding: 20px;
}
.services-container {
padding: 0 10vw;
display: flex;
overflow-x: auto;
scroll-behavior: smooth;
}
.services-container::-webkit-scrollbar {
display: none;
}
.service-card {
flex: auto;
display: inline-block;
width: 300px;
height: 450px;
text-align: center;
margin-right: 40px;
}
.service-image {
position: relative;
overflow: hidden;
height: 350px;
width: 100%;
}
.service-thumb {
width: 100%;
height: 100%;
object-fit: cover;
}< /code>



Anti Acne
Description

Anti Aging
Description
< /code>
< /div>
< /div>
< /p>
Ich habe eine andere Anzeige ausprobiert, aber nichts passiert, es erscheint nur das Bild und Es passt nicht zum Behälter