刪除圖像周圍的空白 - CSS

我想從odoo數據庫中獲取圖像以將圖像顯示爲div背景，但我的圖像周圍有空白區域，所以我需要刪除此空白區域以應用div背景圖像，刪除圖像周圍的空白 - CSS

mycode的：

<div t-attf-style="text-align:center;background:url('/web/image/event.event.ticket/#{doc.event_ticket_id.id}/image_medium') no-repeat; 
       font-size:#{doc.event_ticket_id.font_size}px;width:50%;height:900px;float:left;background-size:500px 900px;display:table;"> 
        <span style="vertical-align:middle;text-align:center;display:table-cell;" t-esc="doc.name"></span> 

       </div>

如何使用CSS去除圖像周圍的空白？

來源

2017-06-19 US-1234

你能提供也許一些代碼，我們可以在這裏跑？有一個鏈接到您的圖像等 –

你需要的是'background-size：cover;'，去檢查[你的選項]（https://developer.mozilla.org/en/docs/Web/CSS/background-size？ v =對照）。 – skobaljic

@skobaljic @skobaljic我已經嘗試過，但它不工作， –

也許嘗試這些代碼的之一：

img{vertical-align:bottom}

或

img { vertical-align: top; }

或

html, body { 
    margin: 0; 
    padding: 0; 
}

希望它幫助。

來源

2017-06-19 08:53:06

你可以嘗試這樣的事情

.main{ 
 
text-align:center; 
 
background:url('https://i.stack.imgur.com/hQPzy.png') no-repeat; 
 
font-size:12px; 
 
width:50%; 
 
height:900px; 
 
float:left; 
 
background-size:500px 900px; 
 
display:table; 
 
background-position:-50px -35px; 
 
}

<div class="main"> 
 
    <span style="vertical-align:middle;text-align:center;display:table-cell;"> Content</span> 
 

 
       </div>

但你必須知道的圖像的白色空間的大小。那麼你可以（ - ）該位置。

來源

2017-06-19 09:46:28

我嘗試了一些東西。請檢查它是否適用於您。在這裏我試圖設置背景位置和背景大小。休息一切可以像div的寬度和高度。

.back{ 
 
    background: url('https://i.stack.imgur.com/hQPzy.png'); 
 
    height: 200px; 
 
    width: 200px; 
 
    background-size: 130% 150%; 
 
    border: 1px solid black; 
 
    background-position: 42% 15%; 
 
}

<div class="back"></div>

來源

2017-06-19 11:46:09 xxCodexx

刪除圖像周圍的空白 - CSS

回答

相關問題