Wie kann man mit TYPO3 Fluid verschiedene Mediengrößen im Hintergrundbild einstellen?

Are you interested in incorporating media, into a background image within a div or section? Consider a scenario where you need to display a background image that supports different devices, such as mobile phones, tablets, desktops, and widescreens.

You can achieve this by using the <f:asset.css /> TYPO3 Fluid ViewHelper for inline CSS options with different sizes. Since the background image is dynamically generated from the TYPO3 backend, you cannot specify it in a CSS file; instead, include it in a Fluid template or partials.

For example, if you have a <div> element where you want to set a responsive background image, refer to the Fluid code example below.

Ein Hintergrundbild kann in TYPO3 Fluid verschiedene Mediengrößen nutzen; hier erfahren Sie, wie Sie diese einstellen und die Größe von Hintergrundbildern anpassen.

Have a Happy TYPO3 Coding!