一直都是在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. Java - 枚举与注解

    Enumeration 于Java 1.5增加的enum type... enum type是由一组固定的常量组成的类型,比如四个季节.扑克花色. 在出现enum type之前,通常用一组int常量表 ...

  2. 十七、ThreadPoolExecutor线程池

    一.简介 executor接口 executor接口在JDK的java.util.concurrent包下,它只有一个抽象方法: void execute(Runnable command); 这意味 ...

  3. golang 编码转化

    在网上搜索golang编码转化时,我们经常看到的文章是使用下面一些第三方库: https://github.com/djimenez/iconv-go https://github.com/qiniu ...

  4. 基于easyUI实现经典系统主界面

    此文章是基于 EasyUI+Knockout实现经典表单的查看.编辑 一. 相关文件介绍 1. home.jsp:系统主界面 <!DOCTYPE html PUBLIC "-//W3C ...

  5. linux服务器上部署jdk+tomcat+rocketmq+redis-cluster

    通常我们拿到一组干净的linux服务器,需要初始化安装一些基础软件,这里一站式介绍部署jdk+tomcat+rocketmq+redis-cluster 前言:如果要在多台服务器上安装,在一台服务器上 ...

  6. libevent学习笔记 —— 牛刀小试:简易的服务器

    回想起之前自己用纯c手动写epoll循环,libevent用起来还真是很快捷啊!重写了之前学习的时候的一个例子,分别用纯c与libevent来实现.嗯,为了方便对比一下,就一个文件写到黑了. 纯c版: ...

  7. SPOJ:NSUBSTR - Substrings

    题面 字符串$ S \(最多包含\) 25 \(万个小写拉丁字母.我们将\) F(x) \(定义为长度为\) x \(的某些字符串出现在\) s \(中的最大次数.例如,对于字符串\) "a ...

  8. FCC上的javascript算法题之中级篇

    FCC中的javascript中级算法题解答 中级算法的题目中用到了很多js的知识点,比如迭代,闭包,以及对json数据的使用等等,现在将自己中级算法的解答思路整理出来供大家参考讨论.欢迎大家提出新的 ...

  9. MySQL数据库(6)----配置文件 my.cnf 的使用

    1. 使用源码安装好MySQL后,其配置文件一般位于 /usr/local/my.cnf,可以使用如下命令查看查看配置文件的搜索顺序: root@javis:~$ mysqld --help --ve ...

  10. Wasserstein GAN最新进展:从weight clipping到gradient penalty,更加先进的Lipschitz限制手法

    前段时间,Wasserstein GAN以其精巧的理论分析.简单至极的算法实现.出色的实验效果,在GAN研究圈内掀起了一阵热潮(对WGAN不熟悉的读者,可以参考我之前写的介绍文章:令人拍案叫绝的Was ...