有时候看到别人的代码中经常出现在body中设置的宽高,不是很理解,于是自己测试了下,瞬间懂了,废话不多说,直接上代码:

首先创建好一个基本的html文件,设body的背景色为red:

相信大家都知道效果了,没错!

接着,我们向body里面加个div,给背景设为白色,然后居中,并且不给div宽度。代码如下:

效果图上:

很显然,body的实际宽度是和子类div中的宽度一样的,那为什么body的背景是覆盖整个页面呢?这是别人的猜想:

于是乎,我们上代码:

效果图上:

果然

因此我们得出一些结论:默认情况下,我们直接操作body的话,body会被浏览器当做根结点来对待,子类(子类没有设置宽的前提下)会等于父类设置的宽,在没有设置任何html的背景色(或其他)属性时,body的高是都是无效的。

关于html中的设置body宽高的理解的更多相关文章

  1. Python设置浏览器宽高

    # 发起请求,设置浏览器宽高 # 代码中引入selenium版本为:3.4.3 # 通过Chrom浏览器访问发起请求 # Chrom版本:59 ,chromdriver:2.3 # 需要对应版本的Ch ...

  2. input与select 设置相同宽高,在浏览器上却显示不一致,不整齐

    遇到 input与select 设置相同宽高,在浏览器上却显示不一致,遂实验了下(IE 10.013 ,Firefox 30.0),得出以下结论 input   width,height 值里面, 不 ...

  3. Android编程心得-在任意类中获取当前屏幕宽高

    进行Android编程时,很多时候都需要获取当前屏幕的宽度与高度,但是当我们需要在别的类中调用屏幕宽高时,直接用原来的方法是不行的,下面我来介绍如何在任意类中调用宽度高度的两种方法. public v ...

  4. absolute和relative元素 设置百分比宽高的差异

    一般元素在页面所占的空间包括:magin border padding content.以前一直以为子元素设置百分比宽高都是以父元素的content值为基准计算的.但是当子元素的position不同时 ...

  5. Lodop打印控件中PRINT_INITA()和PRINT_PAGESIZE()宽高

    Lodop中有两个初始化语句,PRINT_INIT()和PRINT_INITA(),PRINT_INITA()多了四个参数,前两个是整体偏移值,第三四参数是宽高,这个宽高是指打印设计可视化编辑区域的宽 ...

  6. js/jq宽高的理解与运用

    document:1. 与client相关的宽高document.body.clientWidthdocument.body.clientHeightdocument.body.clientLeftd ...

  7. Android中代码设置RadioButton的高端技巧

    不知道怎么起标题,就这样了. 目前主要讲两个方面内容: 代码方式 设置RadioButton的 android:button . android:background 等属性为 @null : 代码方 ...

  8. iOS开发中获取文本的宽高的方式

    /** 计算单行文字的size @parms  文本 @parms  字体 @return  字体的CGSize */ + (CGSize)sizeWithText:(NSString *)text ...

  9. 前端web设置div宽高一样

    <div class="constant-width-to-height-ratio"></div> .constant-width-to-height-r ...

随机推荐

  1. cpu中断

    中断是什么?cpu在中断的时候做了些什么? 答:中断就是中止当前正在执行的工作,而去执行引起中断的事件,当引起中断的事件执行完毕之后,CPU继续执行以前的未执行完的工作. CPU暂时中断当前正在执行的 ...

  2. linux自动定时备份web程序和mysql数据库

    前些天受朋友说linux定时备份不知道怎么搞,叫帮忙处理一下.由于这段时间正闲着,所以也就欣然答应.由于朋友对linux不懂也希望我将操作的过程记录下来,也就是越详细越好.所以写得比较$%^& ...

  3. Google Code Jam 2015 R2 C

    题意:给出若干个句子,每个句子包含多个单词.确定第一句是英文,第二句是法文.后面的句子两者都有可能.两个语种会有重复单词. 现在要找出一种分配方法(给每个句子指定其文种),使得既是英文也是法文的单词数 ...

  4. dump、cpio、tar、dd四种备份工具比较

    原文  http://blog.csdn.net/ether_lai/article/details/12656219 dump dump可执行文件系统增量备份的存储操作 ,dump 可将目录或整个文 ...

  5. ACM/ICPC 之 暴力打表(求解欧拉回路)-编码(POJ1780)

    ///找到一个数字序列包含所有n位数(连续)一次且仅一次 ///暴力打表 ///Time:141Ms Memory:2260K #include<iostream> #include< ...

  6. ACM/ICPC 之 数论-费马大定理(HNUOJ 13371)

    好歹我是数学专业的学生,还是要写写训练的时候遇到的数学问题滴~~ 在ACM集训的时候在各高校OJ上也遇见过挺多的数学问题,例如大数的处理,素数的各种算法,几何问题,函数问题(单调,周期等性质),甚至是 ...

  7. js闭包问题

    function picLinkInit(parentClassName, imgW, imgH, childClassObjs) { var $match = $(parentClassName); ...

  8. 汉企PHP开班

    明天PHP正式开班,没什么大目标 ,在四个半月的时间吧基础知识掌握牢固,自信的面对企业.

  9. .net如何实现时间相减得到天数

    第一种方法: 为了得到时间的天数,代码如下:(计算整天,不含半天) DateTime start = DateTime.Parse(txt_start.Value.Trim());//开始时间 Dat ...

  10. 已有a,b两个链表,每个链表中的结点包括学号,成绩。要求把两个链表合并。按学号升序排列.

    #include <stdio.h>#define SIZE sizeof(struct student)struct student{       long num;       flo ...