首先行高百分比的书写，百分比是针对字体大小进行设置的，也就是说如果你的文字大小为20px，那么100%就是20px，这个和你的需求不符合
其次，CSS当中也不能写成height/2的样子
那么，两种方案能够解决这个问题
1 改变标签的默认显示样式，然后使用vertical-align属性进行控制
<style>.box {
width: 800px
height: 400px
border: 10px solid red
}
.demo {
float: left
display: table
width: 33%
height: 50%
border: 1px solid black
}
.demo > p {
display: table-cell
vertical-align: middle
}
</style>
<div class="box">
<div class="demo">
<p>新手书籍推荐：《HTML5布局之路》</p>
</div>
</div>
显示效果：
2 使用JS进行动态的样式设置（即通过JS动态的获取这个标签的高度，然后再通过 元素.style.lineHeight的方法来设置具体的行高值，当然，这种设置比第一种要麻烦的多）
css监听元素高度如下。1、页面渲染完成后(onReady函数里)去获取元素1在页面上距离顶部的高度fixedTop。
2、用监听页面滚动函数onPageScroll得到当前页面滚动高度，高度是页面在垂直防线已滚动的距离(单位px)。
父级元素设置min-height:100px(设置除ie6的其他浏览器)_height:100px（针对ie6，ie6特性高度超过100px会自动撑开）然后子divcss高度height:100px
