谷歌、火狐浏览器 缩放为80% 时,margin值才正确
声明:小白的笔记,欢迎大神指点。联系QQ:1522025433。
在网页布局中,通过 谷歌浏览器或火狐浏览器 预览时,发现我们定义的盒模型width,height,margin,padding 值都是不准确的,具体我们来看下面的示例:
css代码:
* {
margin:;
padding:;
}
.box1 {
width: 200px;
height: 200px;
background-color: red;
} .box2 {
margin-top: 200px;
width: 200px;
height: 200px;
background-color: red;
}
html代码:
<div class="box1"></div>
<div class="box2"></div>
谷歌浏览器中默认缩放为100%时的效果图(火狐一样,就不截图了):
谷歌浏览器中当调整缩放为80%时的效果图(火狐一样,就不截图了):
此实例说明: 火狐或谷歌浏览器自带放大功能(ie没有此问题),这是我们应该注意的。
谷歌、火狐浏览器 缩放为80% 时,margin值才正确的更多相关文章
- 谷歌浏览器,火狐浏览器,ie浏览器解析顺序
谷歌(版本 55.0.2883.87 m),火狐(48.0.2),ie(11.576.14393.0)对三个浏览器简单的进行了一下试验发现,谷歌浏览器是等到html全部解析完毕之后才开始渲染,而另外两 ...
- 火狐浏览器如何js关闭窗口的几种解决方法
今天在项目上有一个页面要求在几秒后自动关闭,想着还比较简单,用window.close()就可以了,但是用IE/谷歌/火狐浏览器试了一下,发现IE可以,谷歌用网上的兼容方法也可以实现,但是火狐这里卡住 ...
- firebreath 在谷歌和火狐浏览器下的调试 以及打包
在寻找插件开发资料的过程中找到了一个开发浏览器插件的开源项目——firebreath firebreath的安装以及测试我就不再叙述了,可以参考大神的文章 . http://www.blogjava. ...
- Google Chrome谷歌/火狐/Safari浏览器开发者工具基本使用教程
前言 在阅读下面内容之前,那么些简单的了解浏览器开发者工具到底是什么东西,到底有什么用途. 浏览器开发者工具到底是什么? 其实简单的说,浏览器开发者工具就是给专业的web应用和网站开发人员使用的工具, ...
- 无障碍阅读:页面缩放兼容性处理(zoom,Firefox火狐浏览器)
1.无障碍阅读使用场景 无障碍阅读一般在政府类网站使用比较多,如: 天津海事局(http://www.tjmsa.gov.cn/),其中天津海事局的页面放大和页面缩小在firefox浏览器下存在bug ...
- 谷歌chrome浏览器和火狐firefox浏览器自带http抓包工具和请求模拟插件
谷歌chrome浏览器自带http抓包工具 chrome://net-internals/ 谷歌chrome浏览器http请求模拟插件:postman 火狐http请求模拟插件:httprequest ...
- 一段能导致火狐、谷歌Safari浏览器崩溃,甚至让iPhone重启的代码
JavaScript代码,能导致火狐.谷歌Safari浏览器崩溃,甚至让iPhone重启 <html> <body> <script> var total = &q ...
- laydate时间组件在火狐浏览器下有多时间输入框时只能给第一个输入框赋值的问题
遇到的问题: laydate时间组件在火狐浏览器下有多时间输入框时只能给第一个输入框赋值的问题(safari下也有同样问题); 解决办法: 给laydate绑定id; 解决前代码: <input ...
- 谷歌、火狐浏览器下实现JS跨域iframe高度自适应的完美解决方法,跨域调用JS不再是难题!
谷歌.火狐浏览器下实现JS跨域iframe高度自适应的解决方法 导读:今天开发的时候遇到个iframe自适应高度的问题,相信大家对这个不陌生,但是一般我们都是在同一个项目使用iframe嵌套页面,这个 ...
随机推荐
- 【提示框】【计时事件】【cookie】
1.提示框 1)警告框 <script>function disp_alert(){alert("我是警告框!!")}</script> 2)确认框 fun ...
- Netty实现简单UDP服务器
本文参考<Netty权威指南> 文件列表: ├── ChineseProverbClientHandler.java ├── ChineseProverbClient.java ├── C ...
- [Kubernetes]关于K8s,你应该知道的一些东西
Kubernetes概述 Kubernetes(也常称K8s,用8代替8个字符"ubernete"而成的缩写),是一个开源的,用于管理云平台中多个主机上的容器化应用. 它的一个核心 ...
- Linux就该这么学(3)-管道符、重定向与环境变量(学习笔记)
1.Linux命令与文件读写操作有关的重定向技术: 学习目标:主要解决输出信息的保存问题. 标准覆盖输出重定向: 标准追加输出重定向 错误覆盖输出重定向 错误追加输出重定向 输入重定向 标准输入(ST ...
- proxyTable设置代理解决跨域问题
应用场景:在不同域之间访问是比较常见,在本地调试访问远程服务器....这时就有域问题. 解决方案一:在config里面的index.js里面的proxyTable //这里理解成用‘/api'代替ta ...
- boost.asio包装类st_asio_wrapper开发教程(2013.12.8更新)(二)
如果你是偶然浏览到这里,请先看 源代码及例程下载地址:命令行:svn checkout http://st-asio-wrapper.googlecode.com/svn/trunk/ st-asio ...
- VC中的字符串转换宏
ATL7.0引入了几个新的转换类和宏,现有的宏提供了显着的改善.新的字符串转换类和宏的名称,采取的形式如下: C SourceType [C]DestinationType[EX] ...
- CF 1138F 超级有意思的一道交互题QVQ
题意 有一张有向图,由一条长度为 T 的链和一个长度为 C 环组成,但是你并不知道 T 和 C 是多少 图的出发点在链的一段,终点在链的另一端,同时终点与一个环相连,大概有点内向树感觉 现在有 10 ...
- VS2013中如何解决error C4996: 'fopen'问题
今天编写控制台应用程序时出现如下错误 error C4996: 'fopen': This function or variable may be unsafe. Consider using fop ...
- 基于数组的循环队列(C++模板实现)
循环队列使用数组实现的话,简单.方便.之前实现的队列,当尾端索引到达队列最后的时候,无论前面是否还有空间,都不能再添加数据了.循环队列使得队列的存储单元可以循环利用,它需要一个额外的存储单元来判断队列 ...