html 字段位于底部,html中header,footer分别固定在顶部和底部

最新推荐文章于 2023-02-03 19:57:24 发布

JackyBaldheadWang

最新推荐文章于 2023-02-03 19:57:24 发布

阅读量1k

点赞数

文章标签： html 字段位于底部

page01

6 .container{position:relative;width:100%;min-height:100%;}

7 .header{padding-bottom:10%;width:100%;position: fixed;background-color:blue;top:0px;left:0px;}

8 .main{position: fixed;width: 100%;height: 80%;background-color: green;top:10%;left:0px;}

9 .footer{height:10%;width:100%;position:fixed;bottom:0px;left:0px;background-color: yellow;}

main

效果图如下：(header固定在顶部，footer固定在底部)

bootstrap让footer固定在顶部和底部

一.原理使用fixed进行固定定位,相对于浏览器窗口进行定位,然后再设置其z-index的值即可. 二.Bootstrap中使用的类 1.顶部固定:navbar-fixed-top 2.底部固定:n ...

[Android Bug] ListView中Header, Footer无法隐藏(gone)的问题

ListView中Header.Footer View应该是会应该遇到, 比如说,滚动到底部时,自动开始加载: 对于一些应用市场,会在Header中加上ViewFlipper做应用推荐(滚动的那种,好 ...

让页脚footer永远固定在页面的底部，而不是永远固定在显示器屏幕的底部的方法

Joomla 文件操作常用方法

今天介绍下joomla下文件操作常用方法,这些方法在文件读写,图片文件上传,等都有用处. jimport('joomla.filesystem.file'); $j = new JFile(); ge ...

Linux下编译安装PCRE库

备注:如果没有root权限,使用 --prefix 指定安装路径 ./configure --prefix=/home/work/tools/pcre-8.xx =================== ...

LTDFZ

开关稳压器

EXTJS 4&period;2 资料控件之Window窗体相关属性的用法

最大化,最小化,是否显示关闭按钮 var win_CommonPicLibMultiple = Ext.create("Ext.window.Window", { title: & ...

mysql 数据库备份还原

参考资料: http://blog.51yip.com/mysql/139.html

json在PHP中应用技巧

一.json_encode() 该函数主要用来将数组和对象,转换为json格式.先看一个数组转换的例子: $arr = array ('a'=>1,'b'=>2,'c'=>3,'d' ...

Go指针

Go 语言指针 Go 语言中指针是很容易学习的,Go 语言中使用指针可以更简单的执行一些任务. 接下来让我们来一步步学习 Go 语言指针. 我们都知道,变量是一种使用方便的占位符,用于引用计算机内存地 ...

Servlet(三)：获取表单数据、解决乱码和报错问题

在了解了servlet的生命周期以及运行过程后,再来动手写一个小例子,加深对servlet的理解. 一.需求说明在用户注册信息页面,输入用户名.密码.性别.邮箱等一些信息后,页面返回刚刚填写的信息. ...

关注