我想在屏幕中间调整内容框的大小

时间:2019-03-24 08:49:00

标签: html css

我正在尝试做到这一点,以便在调整Web浏览器的大小时,页面上的内容框会调整大小,但会从页面中间而不是边缘开始调整大小。我已经调整了内容框的大小,只是需要帮助才能从中间调整它们的大小。

#getting-started {
  width: 1400px;
  margin: 0 auto;
  background-color: #9599b8;
  border: solid 1.5px #1f2a7f;
  border-radius: 15px;
  margin-top: 16px;
  margin-bottom: 16px;
  align-items: center;
  max-width: 100%;
}
<div id="getting-started">
  <h1>Li Europan lingues</h1>
  <p>Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores.</p>
  <p>At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues.</p>
  <p>It va esser tam simplic quam Occidental in fact, it va esser Occidental. A un Angleso it va semblar un simplificat Angles, quam un skeptic Cambridge amico dit me que Occidental es. Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles.</p>
</div>

我希望它从左侧开始调整大约25%的尺寸。

1 个答案:

答案 0 :(得分:0)

检查此我使用过的属性resize property定义是否(以及如何)调整元素的大小检查此代码。.i希望它在调整大小时对您有帮助等比例的

#getting-started {
width: auto;
margin: 0 auto;
background-color: #9599b8;
border: solid 1.5px #1f2a7f;
border-radius: 15px;
margin-top: 16px;
  resize: both;
  overflow: auto;
margin-bottom: 16px;
align-items: center;
max-width: 100%;}
<div id="getting-started">
<p>Let the user resize both the height and the width of this div element.</p>
  <p>To resize: Click and drag the bottom right corner of this div element.</p>
</div>

检查一下希望对您有帮助