整個圖像不顯示在網頁的標題部分

我有一個圖像，我試圖在網頁的標題部分看到。但是，只有部分圖像出現，我希望看到整個圖像。整個圖像不顯示在網頁的標題部分

這是爲了顯示圖像

<div class="container"> 
    <div class="row" > 
     <div class="col-sm-12" style="background: url('image1.jpg'); color: white;"> 
      <center> 
       <h1>Sonic Train</h1> 
      </center> 
      <center>Train machine learning models at Sonic speed...</center> 
     </div> 
    </div>

的代碼，可以在行動here

整個圖像看起來看到如下，但是，只有圖像的一部分被看見。

來源

2016-03-01 saltmangotree

圖像是'div'的背景，div的高度小於圖像的高度。我不確定你還期望發生什麼？ –

你可以看看[縮放背景圖片]（https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Background_and_Borders/Scaling_background_images），但這不會調整你的'div'的高度 – empiric

你可以使用CSS height屬性增加DIV的高度，就像@Rory McCrossan在評論提到的DIV比圖像，例如小：

<div class="col-sm-12" style="background:url('image1.jpg');color:white; height: 500px;">

希望這幫助。

來源

2016-03-01 11:03:35

或使用最小高度：500px; – silviagreen

整個圖像不顯示在網頁的標題部分

回答

相關問題