如何为Blogger创建一个移动响应主题,其中包含用于完整大小标题的HTML代码,底部的html小部件以及导航栏?

时间:2017-07-29 15:31:10

标签: html mobile widget navbar blogger

我手动使我的Blogger主题响应,到目前为止,它已经没问题了。我唯一的问题是标题,html小部件和导航栏。

  1. 我的标题在桌面上全屏显示。我在桌面上观察了其他带有全尺寸标题的博客。移动版本显示了一个不同的标题 - 井,我认为是标题的放大版本。是否有我可以输入的.mobile html代码会使标题看起来不同,或者可能只是为移动设备单独添加标题?

  2. 桌面上的HTML小部件,如“关于我”小部件,Twitter小部件,Instagram小部件等等......它们通常位于桌面上的侧边栏上。在移动设备上,当您向下滚动到所有帖子下方的最后一部分时,我希望我的HTML小部件显示在底部。我看到其他博客做同样的事情 - 在移动设备上,他们的侧边栏(例如他们不同的小部件)仍然出现,尽管这次是在页面的最底部。因此,移动设备上的博客帖子占据了整个页面。我可以使用任何HTML代码来实现这个目标吗?

  3. 最后,桌面上的导航栏包括主页,时尚,美容,旅游,联系,关于,以及我的社交媒体图标和搜索栏。它是一个粘性的导航条,粘在页面顶部的页面顶部,即使向下滚动也始终保持在屏幕顶部。我再次观察了其他博客的导航栏和移动设备上的导航栏,他们将所有标签缩小为一个方形,如下所示:

  4. 我想要的移动导航栏示例

    xxx

    我想创建这样的东西,所以当你点击带有3条水平线的图标时,就会弹出这样的东西:

    导航栏标签

    xxx

    所以是的 - 有没有人知道如何让html小部件仅出现在移动Blogger网站的底部,有没有人知道如何为移动设备创建这样的导航栏?谢谢!

1 个答案:

答案 0 :(得分:0)

我认为您正在寻找的是像Bootstrap这样的解决方案。 http://getbootstrap.com/

这个框架为您提供移动优先和响应功能,我认为它们非常简单。