将背景设置为 div 标签，materialize.css答案

【问题标题】：Set background to div tag, materialize.css将背景设置为 div 标签，materialize.css
【发布时间】：2016-10-27 20:46:18
【问题描述】：

使用materialize.css(http://materializecss.com)，需要将图片设置为输入表单的背景，所以当窗口调整大小时，图片应该调整大小。现在它看起来像：当浏览器窗口半屏大小像这样：当浏览器窗口最大化时，它看起来很糟糕：我希望你能明白，对不起我的英语。所以我需要为该表单提供适当的 html 代码。提前致谢。

更新：我的 html 代码：

<div class="container">

    <div class="row col s12">
        <div class="row col s8 offset-s2 white z-depth-3">

            <div style='float: left; width: 100%; overflow: hidden; background: url("../static/assets/images/envelope.png") center center no-repeat;' class="col s12">

                <div class="row">
                    <h5 class="center">Адрес для получения посылки:</h5>
                </div>
                <div class="row">
                    <div class="input-field col s5 offset-s1">
                        <input id="firstName" type="text" class="validate"/>
                        <label for="firstName">Имя</label>
                    </div>
                    <div class="input-field col s5">
                        <input id="lastName" type="text" class="validate"/>
                        <label for="lastName">Фамилия</label>
                    </div>
                </div>
                <div class="row">
                    <div class="input-field col s5 offset-s1">
                        <input id="country" type="text" class="validate"/>
                        <label for="country">Страна</label>
                    </div>
                    <div class="input-field col s5">
                        <input id="zipCode" type="text" class="validate"/>
                        <label for="zipCode">Индекс</label>
                    </div>
                </div>
                <div class="row">
                    <div class="input-field col s5 offset-s1">
                        <input id="city" type="text" class="validate"/>
                        <label for="city">Город</label>
                    </div>
                    <div class="input-field col s5">
                        <input id="street" type="text" class="validate"/>
                        <label for="street">Улица</label>
                    </div>
                </div>
                <div class="row">
                    <div class="input-field col s2 offset-s1">
                        <input id="house" type="text" class="validate"/>
                        <label for="house">Дом</label>
                    </div>
                    <div class="input-field col s2">
                        <input id="room" type="text" class="validate"/>
                        <label for="room">Квартира</label>
                    </div>
                </div>
                <div class="row center">
                    <a class="waves-effect waves-light btn"><i class="material-icons right">send</i>Сохранить</a>
                    <br/>
                </div>

            </div>
        </div>
    </div>
</div>

【问题讨论】：

我们无法调试 img 你应该提供一些代码

标签： html css forms background materialize

【解决方案1】：

你的图片在 CSS 中的最小宽度？

<div style='min-width: XXXpx; float: left; width: 100%; overflow: hidden; background: url("../static/assets/images/envelope.png") center center no-repeat;' class="col s12">

其中 XXX 是您的内容宽度 + 大约 30 像素的图像边框。

【讨论】：