多餘的細線與背景圖像

我已經分度，未來風格：多餘的細線與背景圖像

.top-pattern { 
    width: 1024px; 
    height: 92px; 
    background-image: url("https://s21.postimg.org/p0amqt8wn/pattern-top-big.png"); 
    background-repeat: repeat-x; 
    background-size: contain; 
}

這是很簡單的偉大工程。但在某些設備（Mac和移動設備）中，在div下面出現了奇怪的線條。這是什麼？如何刪除它？

實施例：https://jsfiddle.net/wx92fb61/

截圖：https://gyazo.com/3020d6720d27fcbd0315a55fce0fb016

P.S.我檢查了我的圖像100次：圖像中沒有任何一行。

來源

2017-04-01 Crabar

你的CSS必須像，例如：

@media (min-width:768px;){ 
.top-pattern { 
    width: 1024px; 
    height: 94px; 
    background-image: url("https://s21.postimg.org/p0amqt8wn/pattern-top-big.png"); 
    background-repeat: repeat-x; 
    background-size: contain; 
} 
} 

@media (max-width:768px;){ 
.top-pattern { 
    width: 100%; 
    height: 94px; 
    background-image: url("https://s21.postimg.org/p0amqt8wn/pattern-top-big.png"); 
    background-repeat: repeat-x; 
    background-size: contain; 
} 
}

在手機或平板電腦

你最好有100％的寬度大於像素值，那麼你應該在頭部添加一個初始規模的html來捕捉設備的固定值。

來源

2017-04-01 08:00:47

它沒有修復一個錯誤，我仍然在我的Mac上看到這條線。 – Crabar

爲該行添加一個屏幕截圖 –

我已添加爲該帖子的更新。 – Crabar

請參閱，如果您可以重寫此CSS類並刪除盒陰影。我認爲這是讓你的邊界。

.image-box-component .image-viewer { 
    box-shadow: 0 0 0px rgba(0,0,0,0) !important; 
}

來源

2017-04-01 13:50:05

我試圖將這個CSS添加到我的div，但沒有任何改變。 – Crabar

多餘的細線與背景圖像

回答

相關問題