zoukankan      html  css  js  c++  java
  • body和html

    1 关于html和body的背景颜色的一些变现

    当给body设置背景颜色时(html没有背景颜色),这时body被当做根节点被浏览器俘获,浏览器界面的背景颜色就为body的background颜色;当html设置背景颜色时,这html被当做根节点被浏览器俘获,浏览器界面的背景颜色就为html的background颜色,这时body的高度显示为正常的高度(body的背景色变成了正常的body标签(一个实实在在,普普通通标签)的背景色)

    关于height:100%;

    要想高度百分比起作用,一般来说,要满足两个条件:其一,父标签有高度可寻,就是向上遍历父标签要找到一个定值高度(body,html另外讨论),如果中途有个height为auto或是没有设置height属性,则高度百分比不起作用;其二,标签本身的属性,如果inline属性的标签,如果没有浮动,zoom,或是绝对定位之类属性是不支持百分比高度的,block或inline-block属性可以说是高度百分比起作用的前提条件之一吧。
    而这里要讲的是关于body和html的高度百分比显示的。
    默认状态下,body不是高度100%显示的,不要看body定义background属性好像body就是满屏显示的,正如上面所推断的,此背景已非body之背景。用这个body{background:#039; border:50px solid #C00;}一测便知。看边框范围是否高度100%显示,答案是否定的。见下图(截自IE6,Firefox浏览器下表现一致):

    那么body是否支持height:100%;呢?经过我的测试,IE6支持,Firefox浏览器不支持。
    要想让Firefox浏览器也支持body的height:100%;是简单的,就是设置html标签height:100%;一旦设置了height:100%;则无论哪个浏览器下body都支持height:100%;了,而body内部的容器也可以支持height:100%;了。
    前段时间看到百度的一道面试题,说什么透明层无论滚动与否都满屏显示,其实就是对html和body标签做一番手脚,两者高度100%显示,同时溢出隐藏(overflow:hidden),然后用一个div高度100%系显示,溢出滚动。而这个透明层就使用绝对定位且与这个div平级,高宽100%显示,就可以使得无论怎么滚动这个透明覆盖层都是满屏显示的。这其实也就解决IE6下浮动层固定定位的经典方法。

    摘自:http://www.zhangxinxu.com/wordpress/2009/09/%E5%AF%B9html%E4%B8%8Ebody%E7%9A%84%E4%B8%80%E4%BA%9B%E7%A0%94%E7%A9%B6%E4%B8%8E%E7%90%86%E8%A7%A3/

  • 相关阅读:
    Kubernetes(k8s)中namespace的作用、反向代理访问k8s中的应用、k8s监控服务heapster
    Kubernetes(k8s)中dashboard的部署。
    Kubernetes(k8s)中Pod资源的健康检查
    Kubernetes(k8s)安装dns附件组件以及使用
    Kubernetes(k8s)的deployment资源
    Kubernetes(k8s)的Service资源
    Kubernetes(k8s)的RC(Replication Controller)副本控制器
    Kubernetes(k8s)常用资源的使用、Pod的常用操作
    简易图书管理系统(主要是jsp+servlet的练习),基于jsp+servlet的图书管理系统
    js 提取 sql 条件 表名 limit
  • 原文地址:https://www.cnblogs.com/xiaofenguo/p/6419575.html
Copyright © 2011-2022 走看看