如何在最小化浏览器选项卡时保持文本仍然保持不变？

我试着创建一个文本容器。但是，当我最小化我的浏览器选项卡时，我的文本不断挤压。即使最小化，我如何使文本保持不变？如何在最小化浏览器选项卡时保持文本仍然保持不变？

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Savana - About</title> 
 
    <meta charset="utf-8" /> 
 
    <style> 
 
    body { 
 
     font-family: 'Open sans', sans-serif; 
 
    } 
 
    .container-a { 
 
     width: 100%; 
 
     height: 400px; 
 
     background-color: #ffd800; 
 
    } 
 
    .container-a h1 { 
 
     margin: 0; 
 
     text-align: center; 
 
     position: relative; 
 
     top: 100px; 
 
    } 
 
    </style> 
 

 
    <body> 
 
    <div class="container-a"> 
 
     <h1> 
 
      impeccable craftsmanship<br /> 
 
      ridiculously comfy shoes<br /> transformative impact 
 
     </h1> 
 
    </div> 
 
    </body> 
 

 
</html>

来源

2016-05-31 J. Koh

您的意思是说，当您调整屏幕大小时，在相同的行中保留相同的单词吗？ –

它适用于所有尺寸，你想要什么？ – Bharat

是的，这就是@ Error404 –

容器被重新调整大小为您调整窗口。您可以通过几种方法来防止这种情况，例如为容器添加最小宽度，以便在达到特定大小时不会再变小。

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Savana - About</title> 
 
    <meta charset="utf-8" /> 
 
    <style> 
 
    body { 
 
     font-family: 'Open sans', sans-serif; 
 
    } 
 
    .container-a { 
 
     width: 100%; 
 
     height: 400px; 
 
     background-color: #ffd800; 
 
     /* Added min width for your container here */ 
 
     min-width: 950px; 
 
    } 
 
    .container-a h1 { 
 
     margin: 0; 
 
     text-align: center; 
 
     position: relative; 
 
     top: 100px; 
 
    } 
 
    </style> 
 

 
    <body> 
 
    <div class="container-a"> 
 
     <h1> 
 
      impeccable craftsmanship<br /> 
 
      ridiculously comfy shoes<br /> transformative impact 
 
     </h1> 
 
    </div> 
 
    </body> 
 

 
</html>

来源

2016-05-31 13:21:19 Greg2518

是的，我把我的身体选择器，让我没有必要键入每个容器的最小宽度。 –

你可以不喜欢这些，这是正确的方式。

<div class="container-a" style=" resize: none;"> 
    <h1> 
     impeccable craftsmanship<br /> 
     ridiculously comfy shoes<br /> transformative impact 
    </h1> 
</div>

来源

2016-05-31 13:22:24 Bharat

如何在最小化浏览器选项卡时保持文本仍然保持不变？

回答

相关问题