我做了一些 research在这件事上，但似乎没有用。
我希望能够制作一个 <svg>包含整个浏览器屏幕的容器(也就是除选项卡、工具栏等以外的所有内容)。
所以如果你看图片，我想要 <svg>占据选项卡工具栏下方到页面底部的所有内容(是视口(viewport)还是窗口？)——也就是红色框中的所有内容。
这是我到目前为止的代码(只是 <script /> ):
<script>
function startThePage(){
var height = $(document).height();
var width = $(document).width();
var svgSelection =
d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
var myCircle = svgSelection
.append("circle")
.attr("cx", (width/2))
.attr("cy", (height/2))
.attr("r", 22)
.style("fill", "lightgray")
.style("stroke", "gray");
};
//alert(window.screen.availWidth);
//alert(window.screen.availHeight);
</script>
出于某种原因，这似乎使文档稍大一些，这意味着用户可以来回滚动(现在其中只有一个填充圆圈，我想将其居中)。这使圆圈偏离了中心。我该如何解决？
最佳答案
我认为 box-sizing:border-box、margin:0;padding:0; 和 overflow:hidden 应该覆盖大部分一切……
关于javascript - 如何根据屏幕宽度/高度在 <body> 中居中 <svg>，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17434175/