文章/答案/技术大牛

发布

社区首页 >问答首页 >HTML页边距-响应导航栏的底部-固定-底部

问HTML页边距-响应导航栏的底部-固定-底部
EN

Stack Overflow用户

提问于 2017-06-13 20:21:43

回答 0查看 1.1K关注 0票数 1

我在mi页面的末尾有这个navbar-fixed-bottom。

<nav class="navbar navbar-default navbar-fixed-bottom" role="navigation">
  <div class="container">
    <img src="images/banner2.jpg" class="img-responsive">
  </div>
</div>

我为HTML添加了页边距底部

html { margin-bottom: 100px }

。。为了避免页脚覆盖我的内容。这适用于桌面分辨率，但分辨率较小，不适用。这是因为页脚的img是响应性的，所以高度会减小，而不是margin-bottom。

问题是如何根据导航栏的高度使html的margin-bottom“响应式”。

谢谢。

html

css

navbar

footer

bootstrap-4

回答

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/44530830

复制

【Flutter】底部导航栏实现 ( BottomNavigationBar 底部导航栏 | BottomNavigationBarItem 导航栏条目 | PageView )

flutter 博客事件索引源码

Flutter 中的 Scaffold 组件实现了基础的材料设计 ( Material Design ) 可视化布局结构 ;

韩曙亮

2023/03/29

6.2K0

【Flutter】底部导航栏实现 ( BottomNavigationBar 底部导航栏 | BottomNavigationBarItem 导航栏条目 | PageView )

底部导航栏效果

components wepy

<template> <view class="me"> 消息列表界面 </view> </template> <script> import wepy from 'wepy'; export default class Me extends wepy.component { components = { } methods = { }; } </script> <template> <view class="me"> 联系人界面

达达前端

2022/04/29

3.8K0

【Flutter】底部导航栏页面框架 ( BottomNavigationBar 底部导航栏 | PageView 滑动页面 | 底部导航与滑动页面关联操作 )

flutter 博客框架索引源码

在 Scaffold 的 bottomNavigationBar 属性设置底部导航栏 ;

韩曙亮

2023/03/29

4.6K0

【Flutter】底部导航栏页面框架 ( BottomNavigationBar 底部导航栏 | PageView 滑动页面 | 底部导航与滑动页面关联操作 )

底部导航栏的几种实现方式

xml java 缓存 textview

Android底部导航栏实现方式真的是太多了~在这里仅介绍几种实现方式~建议使用TabLayout +ViewPager ，TabLayout是Android Material Design中的控件，布局文件简单。

小小工匠

2021/08/16

2.2K0

flutter中的底部导航栏切换

flutter ios android dart 编程算法

做android原生开发时，底部导航栏是通过自定义布局，图片自己上网找，点击之后还要变色，在切换的时候使用fragment，切换下一个的同时上一个隐藏…… 现在，来看flutter怎么实现吧

徐建国

2021/11/30

3.6K0

App之底部导航栏的设计

腾讯云开发者社区电商

hi，这是系列文章：App之xxx的第2篇，第1篇我总结了App之“文字”的设计技巧。今天来总结下app的底部导航栏的设计。我为什么写这个系列的文章。因为我正在做一款app，我在团队中主抓产品设计、UX/UI设计、部分前端开发，少量运营。在工作之余，我决定把所研究的内容写成关于app之xxx的系列文章，文章选择的题材会往“小而精”这个方向努力，范围在我的工作内容中选取。先来看看app常用的导航模式有哪些：列表式、网格式、标签导航、抽屉式导航等。简单对比下优缺点：列表式结构清晰明了，大部分应

mixlab

2018/04/17

4.9K0

TabLayout用法，android顶部导航栏，android底部导航栏

android

TabLayout是android.support.design里的一个控件，使用它可以很方便的做出顶部导航和底部导航。类似于这样的，能设置选中时字体的颜色和选中时的图片。

天涯泪小武

2019/01/17

4.1K0

使用BottomNavigationBar来定义底部导航栏

网站

在iOS中，底部导航栏使用UITabBar就可以实现；在Flutter中，类似的效果可以通过BottomNavigationBar这个组件实现。

拉维

2019/08/16

1.5K0

H5底部添加导航栏遮挡主体内容（移动端底部导航栏实现）

浏览器移动端

增加了如上属性后显示导航栏但是又遮挡了主体内容，今天翻遍了CSDN终于找到了解决办法。

岳泽以

2023/04/06

2.8K0

教你轻松几步实现底部导航栏

其他

Hankkin

2018/09/06

8650

点击加载更多

相似问题

Bootsrap固定导航栏没有页边距底部

116

固定页面底部页边距

(HTML)表格的页边距底部？

引导导航栏边距-底部不工作

Css页边距-顶部与页边距-底部

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

问HTML页边距-响应导航栏的底部-固定-底部
EN

回答

Bootsrap固定导航栏没有页边距底部

固定页面底部页边距

(HTML)表格的页边距底部？

引导导航栏边距-底部不工作

Css页边距-顶部与页边距-底部

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML页边距-响应导航栏的底部-固定-底部EN

回答

Bootsrap固定导航栏没有页边距底部

固定页面底部页边距

(HTML)表格的页边距底部？

引导导航栏边距-底部不工作

Css页边距-顶部与页边距-底部

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML页边距-响应导航栏的底部-固定-底部
EN