2016-10-02 529 views
1

我有一個SVG,我希望它佔據整個屏幕,但是我在一個固定大小的頂部有一個非SVG html頭部,比如100像素。目前,我的SVG對象是使用這種標記創建的:如何在HTML中設置SVG大小

<svg id="svgMainCanvas" xmlns="http://www.w3.org/2000/svg" 
     xlink="http://www.w3.org/1999/xlink" width="100%" height="100%"> 

這會導致出現滾動條。有什麼方法可以將SVG高度設置爲窗口高度減去一定數量的像素?

+0

這已經被問了無數已經多次;主要是關於任意的「元素」或者「div」,而不是專門的SVG - 但是同樣的答案/解決方案也適用。 – CBroe

+0

什麼樣的滾動條?垂直?水平? – Terry

+0

滾動條是垂直的。 –

回答

0

使用CSS

html,body{ 
width:100%; 
height:100%; 
} 
#svgMainCanvas{ 
position:fixed; // avoid scrollbars 
left:0; 
top:0; 
width:100%; 
height:100%; 
}