这个方法是百度百科手机页面用的,先为固定定位元素设一个父元素,不设高度,不设宽度,什么都不设,他的第一个子元素是我们需要做固定定位的元素,这个按照需求写好样式,此时,父元素的高度依然是0,如何使得父元素有高度呢,父元素有了高度,后面来的模块就不用设置margin-top的值了,我们只要在固定定位元素后面写一个同等高度的空div便解决了,这时父元素就有高度了,而且正是我们需要的高度,这个空的div像一根柱子,支撑起了这个空中楼阁。

css的fix高度缺失的更多相关文章

  1. CSS两列高度自适应,右边自适应

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. CSS实现未知高度图文混合垂直居中

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-06-26) CSS实现未知高度图文混合垂直居中,阅读CSS实现未知高度图文混合垂直居中. IE6,IE7,FF3测试通过 ...

  3. 纯CSS实现Div高度根据自适应宽度(百分百调整)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. DIV+CSS自适应窗口高度

    <html> <head> <title>DIV+CSS自适应窗口高度</title> <style type="text/css&qu ...

  5. CSS解决未知高度垂直居中

    尽管有CSS的vertical-align特性,但是并不能有效解决未知高度的垂直居中问题(在一个DIV标签里有未知高度的文本或图片的情况下). 标准浏览器如Mozilla, Opera, Safari ...

  6. css设置select高度(IE,FF,Chrome)[转]

    大家都知道select是无法设置高度和边框颜色等等的在ie67下面,其他的都是可以的,所以有时候为了在所有的浏览器下显示都一致,就使用了 js的模拟,这个是大家经常碰到的,js不光要模拟外观还有模拟事 ...

  7. CSS百分比定义高度的冷知识

    当我们给块级元素设置响应式高度的时候,例如给div设置height=50%,往往没能看到效果. 原因是百分比的大小是相对其父级元素宽高的大小,如最外层元素设置的百分比是对应屏幕而言的. 需要了解的是对 ...

  8. 用CSS让未知高度内容垂直方向居中

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title> ...

  9. CSS中的高度

    https://developer.mozilla.org/en-US/docs/Web/API/element.clientHeight Element.clientHeight是只读属性,以像素为 ...

随机推荐

  1. IDEA搭建Maven 的聚合项目

    今天突然想把自己学习在eclipse上的maven聚合项目搭建到IDEA上,结果IDEA有太多的配置步骤,导致失败了很多次,终于在网上找到了一篇博客 https://blog.csdn.net/for ...

  2. C的xml编程-libxml2

    这里主要讲述libxml2在linux下的使用. (以下内容除了linux下的安装步骤是自己写的,其余均出自http://www.blogjava.net/wxb_nudt/archive/2007/ ...

  3. 【计数】cf223C. Partial Sums

    考试时候遇到这种题只会找规律 You've got an array a, consisting of n integers. The array elements are indexed from ...

  4. position的 relative+absolute实现固定标签在窗口的某个位置

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 关于union的一些问题

    创建一个测试数据表 CREATE TABLE `temp_table` ( `id` int(11) NOT NULL AUTO_INCREMENT, `name` varchar(255) NOT ...

  6. 背景透明度处理 兼容IE

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 【WordPress】CentOS 6.10 测试WP发送邮件失败

    1.错误信息如下: SMTP -> ERROR: Failed to connect to server: Permission denied (13) 2.解决方法: https://gist ...

  8. 最新Python3.6从入门到高级进阶实战视频教程

    点击了解更多Python课程>>> 最新Python3.6从入门到高级进阶实战视频教程 第1篇 Python入门导学 第2篇 Python环境装置 第3篇 了解什么是写代码与Pyth ...

  9. 扒一扒 EventServiceProvider 源代码

    Ajax用一句话来说就是无须刷新页面即可从服务器取得数据.注意,虽然Ajax翻译过来叫异步JavaScript与XML,但是获得的数据不一定是XML数据,现在服务器端返回的都是JSON格式的文件. 完 ...

  10. 18.VUE学习之-v-for操作对象与数值

    一组数组时的循环 二组数组时的循环 另外可以v for 20 可以直接操作数字 <!DOCTYPE html> <html lang="en"> <h ...