Question

我希望将图片作为我网站的背景，但我无法更改图片的大小。有什么办法可以改变图片的大小以适应我的网站吗？

P.S。这是我用来显示我的图片的代码

BorderLayout gl1 = new BorderLayout();
Container middleContainer = new Container(gl1);
parentContiner.addComponent(middleContainer);
GridLayout gl2 = new GridLayout(counter / 3 + 1, 3);
gl2.setAutoFit(true);
Container gridContainer = new Container(gl2);
parentContiner.addComponent(gridContainer);

for (HashMap<String, Object> entry : homeStorage) {
  if (!"".equals(entry.get("img").toString())) {
    counter++;
    Button homeButton = new Button();
    id = entry.get("id").toString();

    imageUrl = entry.get("img").toString();
    title = entry.get("name").toString();
    homePlaceholder = homePlaceholder.scaled(screenWidth / 3 - 17, screenWidth / 3 - 17);
    encodedHomePlaceholder = EncodedImage.createFromImage(homePlaceholder, true);
    Image btnIcon = URLImage.createToStorage(encodedHomePlaceholder, "home_" + title + imageUrl, allUrl.globalHomeImageUrl + imageUrl, URLImage.RESIZE_SCALE_TO_FILL);

    homeButton.setIcon(btnIcon);
***//set the name of button to id***    
    homeButton.setName(id);

    TextArea buttonTitle = new TextArea(properCase(title));

    buttonTitle.setEditable(false);
    buttonTitle.setGrowByContent(true);
    buttonTitle.setGrowLimit(2);
    buttonTitle.setScrollVisible(false);
    Container containerBtnTitle = new Container(new FlowLayout(Label.RIGHT, Label.BOTTOM));
    containerBtnTitle.add(buttonTitle);
    gridContainer.add(LayeredLayout.encloseIn(homeButton, containerBtnTitle));
**//if i remove this line(setLeadcomponent) it works (ie returns different name as set above, otherwise all the button returns the same name (ie last id)**
    gridContainer.setLeadComponent(homeButton);
    gridContainer.revalidate();
}
    homeButton.addActionListener((e) -> {
    if (homeButton.getName().equals("3")) {
        showForm("YoutubeVideos", null);
    } else if (homeButton.getName().equals("17")) {
        showForm("k2Gallery", null);
    } else if (homeButton.getName().equals("15")) {
        showForm("EmergencyCategory", null);
    } else if (homeButton.getName().equals("2")) {
        showForm("PartyClicks", null);
    } else if (homeButton.getName().equals("1")) {
        showForm("WhereTheParty", null);
    } else if (homeButton.getName().equals("5")) {
        showForm("CocktailRecipies", null);
    }

});
}

Answer 1

您可以通过以下方式完成：

background-size: 100% 100%;

或

background-size: contain;

Answer 2

您可以使用background-size属性指定背景图片的大小。

Answer 3

使用background-size属性：

body{
    background: url("images/lvl1.jpg");
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

Answer 4

这将有助于填补背景。

A PHP Error was encountered

Severity: Notice

Message: Undefined variable: hoppa

Filename: views/anasayfa.php

Line Number: 19

Backtrace:

File: D:\wamp\www\proje\application\views\anasayfa.php
Line: 19
Function: _error_handler

File: D:\wamp\www\proje\application\controllers\Welcome.php
Line: 24
Function: view

File: D:\wamp\www\proje\index.php
Line: 292
Function: require_once
A PHP Error was encountered

Severity: Warning

Message: array_values() expects parameter 1 to be array, null given

Filename: views/anasayfa.php

Line Number: 19

Backtrace:

File: D:\wamp\www\proje\application\views\anasayfa.php
Line: 19
Function: array_values

File: D:\wamp\www\proje\application\controllers\Welcome.php
Line: 24
Function: view

File: D:\wamp\www\proje\index.php
Line: 292
Function: require_once

Answer 5

使用background-size: cover;

background-size CSS属性指定背景图像的大小。图像的大小可以完全约束，也可以仅部分限制，以保持其固有比率。

Here is the link for reference

＆＃13;

html,
body {
  position: relative;
  height: 100%;
}

body {
  background-image: url(https://www.planwallpaper.com/static/images/bicycle-1280x720.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

＆＃13;

如何更改图片背景的大小

5 个答案: