位於Y和X中間的內容

-2

所以我不希望我的內容位於沿X軸的中間位置，我希望Y軸中間的內容位於。位於Y和X中間的內容

在我的CSS我用以下，以防止頁面成爲任何大

html { overflow-y: hidden; overflow-x: hidden }

以下是我想達到的目標。舉一個例子，想象一下中間的一個盒子。我相信這可以用JavaScript來完成，我只是不知道如何。

所以上圖中示出了在兩個X和Y軸的中間的框。 請不要發佈如何將其放置在X軸的中間位置，因爲這不是我想要的。任何幫助將很棒，謝謝！

來源

2016-02-25 Munch

http://howtocenterincss.com/ – pawel

可能[div中的中心內容與CSS]的副本（http://stackoverflow.com/questions/4374650/center-content-in-div-with-css） – Paul

設置你的格或框的CSS屬性..

div { 
    /* These first 3 can change */ 
    background: red; 
    width: 100px; 
    height: 100px; 
    /* The important stuff below */ 
    bottom: 0; 
    left: 0; 
    margin: auto; 
    position: absolute; 
    top: 0; 
    right: 0; 

}

看到它在行動中的JS Fiddle

來源

2016-02-25 21:00:12

您可以使用以下函數來相對於父元素沿任一軸動態居中。父容器的overflow屬性設置爲隱藏，並且子元素的marginTop值設置的值：中心（孩子寬度，父母寬）

center= function(Win,Wout){ 
    return (Wout-Win)/2 
}

來源

2016-02-25 20:49:35 nick

你可以用javascript做到這一點，尼克說，但CSS也是一個選項？如果要垂直居中用CSS子元素，你可以這樣做，如本的jsfiddle https://jsfiddle.net/bjf10vyj/ 父位置必須是相對的，那麼孩子

position: absolute;  
top: 50%; 
transform: translateY(-50%);

來源

2016-02-25 21:02:17 Observer

位於Y和X中間的內容

回答

相關問題