核心原理；
height:100%这个概念是子节点相对于父容器而言；所以要让此属性生效，必要的一点就是：父容器必须具有具体的高度信息；
直接在的子节点（如div中）写height:100%是不会生效的，因为此时的高度是不确定的，默认是auto；
方法一
给从根的父容器到子容器的所有容器都设置好百分比高度信息
比如：
[html] view plain copy
132
这样从根的Html开始，到字的div结束，全部都具有百分比高度，这样，就都能够获取到高度信息；
方法二
给父容器设置具体的高度信息；
比如直接写死在样式中，或者用javascript来设置；
示例，用js使得到高度，从而使其中的div全屏：
[html] view plain copy
132
varscreenHeight=document.documentElement.clientHeight
varscreenWidth=document.documentElement.clientWidth
varbody=document.getElementById('body')
body.style.width=screenWidth+"px"
body.style.height=screenHeight+"px"
方法三
给父容器设置位置信息，让其得到高度信息；
示例，用css使body得到高度，从而使其中的div全屏：
[html] view plain copy
132
布局流程为了提高网页制作的效率，布局时通常需要遵守一定的布局流程，具体如下：1、确定页面的版心（可视区）。2、分析页面中的行模块，以及每个行模块中的列模块。3、制作HTML结构 。4、CSS初始化，然后开始运用盒子模型的原理，通过DIV+CSS布局来控制网页的各个模块。 一列固定宽度且居中案例<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document</title><style>.box {width: 900pxbackground-color: #eeeborder: 1px dashed #cccmargin: 0 auto}.top {height: 80px}.banner {height: 120px/*margin: 0 auto*/margin: 5px auto}.main {height: 500px}.footer {height: 100px/*margin: 0 automargin-top:5px*/ margin: 5px auto 0}</style></head><body><div class="top box">top</div><div class="banner box">banner</div><div class="main box"></div><div class="footer box"></div></body></html>您提供的HTML代码中，div元素的border属性值没有指定单位（如px），这可能导致浏览器无法正确解析该CSS规则，从而未正确应用样式。您可以将border的属性值修改为类似于border: 2px solid black的形式来指定边框的像素宽度、样式和颜色。另外，如果该HTML代码是嵌入在其他HTML文档中的，您还需要将其放置在HTML文档的<body>标签中，以确保正确显示。以下是修改后的示例代码：
<!DOCTYPE html>
<html>
<head>
<title>示例</title>
<style type="text/css">
div.one {
width: 100px
height: 100px
border: 2px solid black
}
</style>
</head>
<body>
<h1>呵呵呵</h1>
<div class="one"><p>啊啊啊啊啊你你你</p></div>
</body>
</html>
在这个示例中，div元素的样式已经指定了单位，并且被嵌入在HTML文档的<body>标签中。这应该可以正常显示了。
![[R语言] Heatmap绘图经验总结](/aiimages/%5BR%E8%AF%AD%E8%A8%80%5D+Heatmap%E7%BB%98%E5%9B%BE%E7%BB%8F%E9%AA%8C%E6%80%BB%E7%BB%93.png)
