一直都是在chrome上进行调试，今天终于把bbs论坛这个项目搭建完了，进入IE、Firefox看了看

吓哭了！！！

火狐

Edge

chrome

特别是加了<!DOCTYPE html>后，chrome都出问题了

心好累

等我解决后再来吧~

发现的一些问题

1.火狐浏览器不兼容这种写法，min-height：100% 完全不生效

这就可以很好的解释，为什么在火狐中整个页面撑不起来，原因就是我在body部分使用了min-height

.bgcolor{

    width: 100%;

    display: flex;

    flex-direction: column;

    min-height: 100%;/*即使内容区高度不够,footer也在底部*/

    z-index: 2;

    background: #000000;

}

火狐min-height兼容性的解决办法：http://www.cnblogs.com/Man-Dream-Necessary/p/5710915.html

知乎上对这个问题的相关回答：https://www.zhihu.com/question/26510142

min-height：百分比的计算后值与其 Containing Block 有关，如果其 Containing Block 的高度没有被显式声明，并且这个元素本身不是绝对定位的，那么其百分比值将被作为 0 处理。对于 position 为 static/relative 的元素，Containing Block 为最接近的祖先块级元素的内容区域。

解决办法：将要设置为100%height的元素的父元素的高度都设置为100%时，这个min-height才会生效。

这里我们将html和body标签的height都设为100%

html{

    height: 100%;

}

body{

    color: #333;

    font: 400 16px/1.5 Microsoft YaHei, sans-serif;

    overflow: auto;

    height:100%;

}

此时加入<!DOCTYPE HTML>后在chrome下的页面如图所示，高度能撑到100%，min-height生效

火狐下，min-height也生效，但都与最初设计的效果有不同程度的差距

继续寻找别的问题...

flex布局兼容写法

IE下字体大小

bbs论坛浏览器兼容性问题的更多相关文章

  1. python 学习笔记二十 django项目bbs论坛

    项目:开发一个简单的BBS论坛 需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可 ...

  2. Python之路,Day17 - 分分钟做个BBS论坛

    Python之路,Day17 - 分分钟做个BBS论坛   本节内容: 项目:开发一个简单的BBS论坛 需求: 整体参考"抽屉新热榜" + "虎嗅网" 实现不同 ...

  3. Python开发一个简单的BBS论坛

    项目:开发一个简单的BBS论坛 需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可 ...

  4. LNMP环境搭建BBS论坛及伪静态

    我们在mysql备份 LNMP环境中的数据库迁移为独立的服务器的基础上搭建BBS论坛:  [root@bqh-117 ~]# mysql -uroot -p123456 Welcome to the ...

  5. 浏览器兼容性-JS篇

    总结一下平时遇到的浏览器兼容性问题,本篇关于JS. 1.事件绑定 兼容写法: function add(obj,event){ if (obj.addEventListener) { obj.addE ...

  6. CSS3与页面布局学习笔记（八）——浏览器兼容性问题与前端性能优化方案

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  7. Python之路【第十八篇】Django小项目简单BBS论坛部分内容知识点

    开发一个简单的BBS论坛 项目需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可被 ...

  8. CSS 多浏览器兼容性问题及解决方案

    兼容性处理要点1.DOCTYPE 影响 CSS 处理 2.FF: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important 多设一个 ...

  9. 浏览器兼容性之Css篇

    本文与上一篇随笔<浏览器兼容性之Javascript篇>有一定关联,下来我会继续不断总结,旨在解决浏览器兼容性,对遇到类似问题的同仁有所帮助,如有更多解决浏览器兼容性的案例还望大家分享一起 ...

随机推荐

  1. jQuery基础---动画效果

    内容摘要: 1.显示.隐藏 2.滑动.卷动 3.淡入.淡出 4.自定义动画 5.列队动画方法 6.动画相关方法 7.动画全局属性  发文不易,转载请注明出处~ 一．显示.隐藏 jQuery 中显示方法 ...

  2. 记一次吐血的暴力模拟qaq 【多项式输出】

    题目描述 一元 n 次多项式可用如下的表达式表示: 其中,aixi称为 i 次项,ai 称为 i 次项的系数.给出一个一元多项式各项的次数和系数,请按照如下规定的格式要求输出该多项式: 1. 多项式中 ...

  3. 微信小程序通过CODE换取session_key和openid

    微信小程序的用户信息获取需要请求微信的服务器,通过小程序提供的API在小程序端获取CODE,然后将CODE传入到我们自己的服务器,用我们的服务器来换取session_key和openid. 小程序端比 ...

  4. java自学-流程控制语句

    一件事情从开始到结束,需要先做什么,再做什么,最后再怎么做,这段过程就是一个流程.程序逻辑处理也是一个流程,java中有专门的流程控制语句,主要分为这几种:顺序,判断,选择,循环. 1.顺序流程  顺 ...

  5. 撩课-Java每天10道面试题第7天

    撩课Java+系统架构 视频 点击开始学习 61.什么是并发修改异常? 什么是并发修改异常: 当我们在遍历实现了collection接口 与iterator接口的集合时(List.Set.Map), ...

  6. 设计模式之状态模式IFORNOIF(二十二)

    今天大风大雨, 但心情还行, 继续撸DOTA 状态模式(state pattern)定义 当一个对象的内在状态改变时允许改变其行为, 这个对象看起来像是改变了其类 这在我们开发的业务中太常见了, 角色 ...

  7. 关于VUE中 import 、 export 和 export default 的注意问题

    1.import引入一个依赖包,不需要相对路径.import 引入一个自己写的js文件,是需要相对路径的. 示例:import axios from ‘axios’; import AppServic ...

  8. js历史记录

    1. history 是什么? window上的一个对象,由来存储浏览器访问过的历史 2. 用途: 可以动态跳转任意一个已在历史记录中的地址 3..history方法: 1.forward() : 向 ...

  9. js 数组转json，json转数组

    //数组转json串var arr = [1,2,3, { a : 1 } ];JSON.stringify( arr ); //json字符串转数组var jsonStr = '[1,2,3,{&q ...

  10. SSM 框架集-01-详细介绍-入门问题篇

    SSM 框架集-01-详细介绍-入门问题篇 刚开始了解 SSM,首先先解决几个基础问题 1.什么是 SSM 框架集? SSM(Spring+SpringMVC+MyBatis)框架集由 Spring. ...