问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

自适应布局的网页，如何在一个网页上同时显示它的电脑端样式和移动端样式？

头像
浪花儿一朵朵
    60811

    <html>
    <iframe>电脑端</iframe>
    <iframe>移动端</iframe>
    </html>

    在这个网页显示一个比如用bootstrap布局的网页。该怎么办，说说思路。

    html5html
    阅读 6.2k
    4 个回答
    得票最新
    头像
    coachmans
      4.6k21328

      bootstrap本身就是自适应的样式类库

      头像
      poikuma
        63522547

        题主是想要在一个页面里显示bootstrap网页的俩种布局效果么？
        bootstrap本身就根据浏览器界面高宽进行响应式布局的。。。感觉你除非设置一个iframe宽大于1000 一个iframe小于1000 那么浏览器界面就要1000（大）+1000（小）。。。不合理啊

        头像
        kakegu
          962611

          电脑这半边用col-sm,手机半边用col-xl或许能?

          头像
          ybens
            2
            新手上路，请多包涵

            方案1.如果已经有了上面的两个iframe,可以添加媒体查询，当屏幕大小是手机的时候，显示移动端，隐藏电脑端的iframe,如果是电脑，显示电脑端，隐藏手机端的iframe
            方案2.目前还没有编码的情况。首先构建手机端，再添加电脑端的设计，最后用媒体查询，控制电脑端和手机端的显示，遵循手机端优先和渐进增强的设计原则

            撰写回答
            你尚未登录，登录后可以
            • 和开发者交流问题的细节
            • 关注并接收问题和回答的更新提醒
            • 参与内容的编辑和改进，让解决方法与时俱进
            推荐问题