2015-11-01 94 views
0

我有一個gif在標題中使用,並且已經能夠將它與html放在一起,但是我無法居中它並想利用最大寬度100%佔用較小的屏幕尺寸。 Img src使得GIF在小屏幕上顯得太大而無法制作滾動條。我對CSS相當陌生,到目前爲止還沒有找到答案。它用於在方形空間中進行代碼注入。用於標題圖像的CSS,居中,最大寬度%

+0

顯示您的html和css代碼。 – razzak

+0

再次,這是非常新的。但我最初使用img src「GIF的URL」,它可以工作並放置在標題中。不過,據我所知,對齊中心不會影響圖像。另外,當在iPhone中查看時,它會創建一個滾動條來查看所有內容。 – tmpnshmnt2000

+0

歡迎來到Stack Overflow!尋求代碼幫助的問題必須包含在問題本身**中重現它所需的最短代碼**。請參閱[**如何創建一個最小,完整和可驗證的示例**](http://stackoverflow.com/help/mcve) –

回答

0

使用保證金:自動在您的gif使它居中水平。您也可以使用div代替img標籤並使用background-image屬性。

+0

對於屏幕尺寸,style = max width 100% – tmpnshmnt2000

+0

您可以將顯示塊添加到Css中的img中,或者將其用作div中的背景,如上所述。 –

0

看到這裏,這是一個充滿了演示:

h1{text-align:center; 
    background-image:url('http://www.liveside.net/wp- content/images/archive/2008/01/hackspacesblogbkground_2.jpg'); 
    background-repeat:no-repeat; 
    background-size:cover; 
    box-shadow:3px 4px 2px #000; 
    max-width:850px; 
    width:100%; 
    margin:0 auto; 
} 

點擊PIC看看會發生什麼。

http://codepen.io/damianocel/pen/dYKxgW

你只需要設置你的最大寬度上的相關MEIA查詢。