Javascript Bootstrap4：放大主体时的模式渲染问题_Javascript_Html_Css_Twitter Bootstrap_Bootstrap 4

Javascript Bootstrap4：放大主体时的模式渲染问题

javascript html css twitter-bootstrap bootstrap-4

Javascript Bootstrap4：放大主体时的模式渲染问题,javascript,html,css,twitter-bootstrap,bootstrap-4,Javascript,Html,Css,Twitter Bootstrap,Bootstrap 4,我正在尝试使用一个引导html页面，页面主体放大到90%。。引导模式显示从右到下的空格。。为了显示这个问题，我把一个基本的html页面放在一个90%缩放的模态页面上当你点击打开模式时，你会看到模式从右到下的空格。我们如何在没有额外空格的情况下渲染模式，身体缩放90%…所需的输出是模式模糊背景应该覆盖整个屏幕。。模态体应位于x轴的中心，就好像90%和100%的缩放相同，只是90%的缩放是小字体 <!DOCTYPE html> <html lang="en"> <h

我正在尝试使用一个引导html页面，页面主体放大到90%。。引导模式显示从右到下的空格。。为了显示这个问题，我把一个基本的html页面放在一个90%缩放的模态页面上

当你点击打开模式时，你会看到模式从右到下的空格。我们如何在没有额外空格的情况下渲染模式，身体缩放90%…所需的输出是模式模糊背景应该覆盖整个屏幕。。模态体应位于x轴的中心，就好像90%和100%的缩放相同，只是90%的缩放是小字体

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
</head>
<body style="zoom:90%;">

<div class="container">
  <!-- Button to Open the Modal -->
  <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
    Open modal
  </button>
  <!-- The Modal -->
  <div class="modal fade" id="myModal">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <!-- Modal body -->
        <div class="modal-body">
          Modal body..
        </div>
        <!-- Modal footer -->
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
  </div>
</div>
</body>
</html>


引导示例
开放模态
情态体。。
接近

类。模态背景使用100vh和100vw，由于我们应用了90%的缩放，100vh对应于90%的屏幕高度；100vw相当于屏幕宽度的90%

解决方案：用

宽度：100%覆盖此类；身高：100%

.modal background{
宽度：100%！重要；
身高：100%！重要；
}

变焦90%
开放模态
情态体。。
接近
您有需要的输出吗？需要的输出是模式模糊背景应该覆盖整个屏幕。。模态体应处于中心位置