如何让我的网站动态调整元素大小答案

【问题标题】：How to make my website dynamically resize elements如何让我的网站动态调整元素大小
【发布时间】：2020-08-13 01:39:17
【问题描述】：

我对使用 React JS 创建网站的 Web 开发相对较新。

我真的不知道如何让网站上的元素调整大小或在调整窗口大小时很好地排列它们自己，或者看起来像从移动设备查看时一样。

就像当窗口大小沿对角线减小/增大时所有元素都会根据 vh 和 vw 进行自我调整一样，但是如果 vh 保持不变而 vw 发生变化，那么一切都会结束。

是否有任何插件或任何与 ReactStrap 相关的东西可以帮助我实现这种动态调整大小和拟合？或者我应该使用像 wordpress 这样的工具，它们似乎可以自动解决这个问题，而不是我手动为网站编写所有 HTML 和 CSS。

谢谢

【问题讨论】：

你可以使用 react-bootstrap (react-bootstrap.github.io)、material-ui (material-ui.com) 或者其他一些响应式框架...

标签： html css reactjs web mobile-website

【解决方案1】：

您可以使用 Bootstrap 创建响应式网页。对于 React 用户，他们有 React 引导程序，没有 jQuery 依赖项-https://react-bootstrap.github.io/。请尝试这个以获得完全响应的网页。对于响应式网格布局，您可以使用 Bootstrap 网格系统 - https://getbootstrap.com/docs/4.0/layout/grid/

【讨论】：

【解决方案2】：

@yolopolo 您也可以通过学习如何根据设备的屏幕使网站做出响应来做到这一点。请查看这个：https://www.w3schools.com/css/css_rwd_intro.asp

并通过在开发工具中学习 Chrome 的设备模式来测试您的网页是否响应 https://www.atlantic.net/hipaa-compliant-wordpress-hosting/how-to-test-responsive-design-device-mode-chrome-developer-tools/

【讨论】：