我试图将我的移动用户和所有小型设备用户重定向到我的移动版网站。 但我不想改变我的网址。 如下例所示,
桌面版:domain.com(使用桌面版网站)
移动版:domain.com(移动版网站)
答案 0 :(得分:3)
重定向意味着更改窗口位置。
因为你不想拥有一个单独的移动网站, 唯一可行的解决方案是使用像bootstrap这样的良好响应式ui框架。但是在你的标签中你提到了wordpress,我觉得大多数wp主题实际上都是响应式的。
无论如何,如果你想设计一个响应式网站,请使用bootstrap。另一种方法是使用媒体查询编写所有css。 希望有所帮助。
答案 1 :(得分:0)
您需要为此“动态”替换网站的主题。
您可以使用代码进行操作,但时间太长,请使用此插件device theme switcher
答案 2 :(得分:0)
两者的URls应该相同,并且它们的情况也相同。做得好!
现在,要自动呈现特定布局,请获取媒体查询的帮助。
参考
https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
它们定义特定的宽度范围并仅选取这些特定的样式。
所以你有很多工作要做。
这是一种最佳的工作方式,这被称为响应式设计。
您可以找到相同的n
no教程。但是要尝试使用一两个媒体查询。
另外,请阅读有关元标记的信息,这些元标记可以选择用样式表https://css-tricks.com/snippets/html/responsive-meta-tag/
编写的媒体查询 祝你好运!答案 3 :(得分:0)
在WordPress上自定义页面时,您可以在左下角查看您的网站在手机或平板电脑中的外观。
此外,某些页面构建器(如Elementor)允许您控制在哪些屏幕上显示哪些部分。
更好地说明问题的方法是,如何使页面响应?
在阅读Grid Systems
时,您会惊讶于如何简单地改变div的方向,可以带来巨大的用户体验差异。
当使用使用Grid Systems
的框架时,Bootstrap
是受欢迎的框架之一,您可以想象任何屏幕分为12列(网格)。然后,您可以通过添加类来指定div在每个屏幕大小上占用的部分数。例如,<div class = "col-sm-6 col-lg-3" </div>
将覆盖屏幕(水平)在小屏幕(6为12的一半)和四分之一的大屏幕。
这个过程背后的原因是要么左右滚动,这样可以更容易导航。 希望这能让您对制作适合移动设备的网站所需的内容进行一些概述。祝你好运!
答案 4 :(得分:0)
感谢所有人对我的问题发表评论。 现在我写了我自己的答案,我发现了我的问题的答案。
响应设计不是它的答案。您必须显示网站的移动版,而不是网站的自适应版本。所以使用
@media()
没用。
对于此问题,您必须在后端检测用户的设备。例如,在PHP中,您可以使用mobile-detect。 您可以检测设备并显示该设备的模板。
此外,移动检测具有js版本。 click here 我希望你能在这里找到答案。