使用HTML和CSS在网格输入背景图像

问题描述 投票:-2回答:1

我试图把背景图片在我的专栏电网之一,但它不会显示我试图伸展,但它并不好看。我不知道什么是丢失或有不属于suppost在那里一个代码。我看着在每一个论坛,但没有说是关系到我的问题,具体的答案或问题。

    body {
      display: grid;
      grid-template-columns: 100%;
      grid-template-rows: 10vw 50vw 50vw 50vw 50vw 7vw;
      grid-gap: .5em;
      margin: 0;
      padding: 0;

      
    }

    header,
    footer {
      grid-column: 1 / span 2;
    }

    main {
      grid-column: 1 / span 2;
      grid-column: 1 / span 2;
      grid-column: 1 / span 2;
      grid-column: 1 / span 2;
      
    }

    #main1 {
    	background: url("Pics&Video/Sea.jpg") no-repeat center;
    	background-size: contain;
    	
    	
    }


    body {
      margin: 0 auto;
      max-width: 80em;
      padding: 1em 0;
    }

    header,
    main,
    aside,
    footer {
      background: #eaeaea;
      display: flex;
      align-items: center;
      justify-content: center;
    }
<header>
    		Header
    	</header>
    	
    	<main class="main1"> 
    		Main
    	</main >
    	<main class="main2">
    		main
    	</main>
    	<main class="main3">
    		Main
    	</main>
    	<main class="main4">
    		main
    	</main>

    	<footer>
    		Footer
    	</footer>

Sea.jpg

html css image background grid
1个回答
0
投票

在HTML您使用的CSS您使用#类=“MAIN2”αnd。你应该改变CSS .main1 {}

© www.soinside.com 2019 - 2024. All rights reserved.