给body设置高度
今天做一个小demo,需要给body设置高度为100%,然鹅发现只设置body的height不可行,需,html,body{height:100%;}
为何呢?
一个容器的height是从上一级继承而来的,html{height:100%}中设置的html的高度是相对于浏览器来说,而body中的高度又从html中继承,指的是页面的高度。
在查资料时,也发现比较有趣的一点:
当html标签无背景样式时,body的背景色其实不是body标签的背景色,而是浏览器的。
一旦html标签含有背景色,则body的背景色变成了正常的body标签自己的背景色,而此时的html标签最顶级,背景色被浏览器获取,成为浏览器的背景色。
简单的说就是,html优先于body标签,浏览器按html>body的顺序提取其设置的背景样式作为浏览器的背景,也就是用户能看到的背景。
给body设置高度的更多相关文章
- 如何给span设置高度宽度?
内容提要:给Span设置高度和宽度后没有作用.本文介绍了如何如何给span设置高度宽度. CSS模型中经常用的容器是DIV和span. 给Span设置高度和宽度后没有作用. <style typ ...
- div+css总结—FF下div不设置高度背景颜色或外边框不能正常显示的解决方法(借鉴)
原地址:http://blog.sina.com.cn/s/blog_60b35e830100qwr2.html 在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度, ...
- 对Iframe和图表设置高度的优质代码
//对Iframe和图表设置高度 function f() { parent.window.setWinHeight(parent.window.document.getElementById(&qu ...
- Chrome&FF&Opera&下DIV不设置高度显示背景颜色和边框的办法
今天在排版的时候,外层的div不写高度的话背景颜色和边框没法办法显示,但是在IE下面就可以,这个有三个解决办法. 第一: 直接给最外层的div设置高度(不推荐). 第二: 在内部每个div后添加一个清 ...
- pickView不需要明确设置高度
pickView不用设置高度,若设置了,在iOS8.4.1上不会被填充,会造成没有把pickView高度设置成你想要的,但是布局其他地方的时候却会从你设置的地方开始,就会造成布局不紧挨着或者遮盖着的效 ...
- HTML的TextArea标记跟随文本内容自动设置高度
js <textarea name="textarea" id="textarea" style='overflow-y: hidden;height:2 ...
- 关于ckeditor5设置高度
在管理端模板AdminBSBMaterialDesign-master里发现一个比百度编辑器看起来更高大上的编辑器:ckeditor.模板中使用的是版本4,自己在官网上下载了最新版本.在之前的版本,使 ...
- ueditor 设置高度height. ue.setHeight(400); 设置宽度 width
1.引入的文件: <script type="text/javascript" src="../../dist/ueditor1_4_3-utf8-php/uedi ...
- 控件View动态设置高度时会卡顿、速度慢的情况解决
今天碰到这种情况,一直想不通是什么问题,之前一直设置高度的时候也不卡为何今天就这么卡了.做了很多小示例一直是很慢,后来试着把View的上级节点RelativeLayout的替换成了LinearLayo ...
- select设置高度的兼容问题
在IE678下,我们给select设置高度的话,里面的option无法居中,折中的兼容方式就是,我们给select的border:0:外面套一层div,这个div给他设置padding,让select ...
随机推荐
- 打包一沓开源的 C/C++ 包管理工具送给你!
本文作者:HelloGitHub-ChungZH 博客地址:https://chungzh.cn/ 包管理器可以帮助你更方便地安装依赖关系,并决定所安装的版本,提高你的开发幸福感.许多语言都有自己的包 ...
- IT人不仅要提升挣钱能力,更要拓展挣钱途径
前几天我上班路上,和小区门口开车的师傅闲聊,发现他们虽然学历不高,但挣钱的途径不少,比如固定接送多位客户,然后能通过朋友圈拓展新客户,而且通过客户口口相传,也能不断拉到生意,算下来每月也能挣1万5出头 ...
- k8s西游记 - 切换网络插件IP池
前言 最近在另一个k8s集群中,搭建了kong网关,在配置OIDC插件时,希望使用Memcahe代替Cookie来存储会话信息,于是把部署在同一局域网Memcahe的内网IP,比如:192.168.1 ...
- HDU 6053(莫比乌斯反演)
题意略. 思路:首先想到暴力去扫,这样的复杂度是n * min(ai),对于gcd = p,对答案的贡献应该是 (a1 / p) * (a2 / p) * .... * (an / p),得出这个贡献 ...
- Android进阶之路(2)-详解MVP
### MVP简介 >MVP 全称:Model-View-Presenter :MVP 是从经典的模式MVC演变而来,它们的基本思想有相通的[地方](https://baike.baidu.co ...
- Commons组件实现文件上传与下载
一.文件上传 所需jar包 首先是commons-fileupload.jar包 其次是commons-IO.jar包 前者的使用依赖后者,两者缺一不可 实现 前台要求 在前台提交的form表单请求方 ...
- zstu19一月月赛 duxing201606的原味鸡树
duxing201606的原味鸡树 题意: 给定一颗有n(n<=1e9)个节点的完全二叉树,1e5次询问,问某个节点有几个子节点. 思路: 自己在月赛上没有思路,问了zfq才知道. 设两个指标, ...
- hdu 2050 折线分割平面 dp递推 *
折线分割平面 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Subm ...
- CF937B Vile Grasshoppers
Vile Grasshoppers time limit per test 1 second memory limit per test 256 megabytes input standard in ...
- 详细的漏洞复现:Shellshock CVE-2014-6271 CVE-2014-7169
目录 前言 漏洞原理 利用方式 复现过程 1. 环境准备 (1) 为容器配置固定IP地址 (2) 查看bash版本 2. 本地验证:测试镜像系统是否存在漏洞 3. 远程模拟验证(原理验证) (1) 查 ...