React实现百分比布局

之前百度,各位大佬说 react各种不能进行百分比布局。都推荐使用rem布局,说是
react组件之间插入了一些div,导致百分比设置高度失效了,但是按照这种思路
我在根元素那里给他设置百分比不就行了吗

<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<div id='app' style="height:100%;width:100%;"></div>
<script   src="dist/main.js"></script>
</body>
</html>

然后再给html,和body设置成100%

html,body{
width:100%;height:100%;margin:0
}

用百分比布局

.loginBoxContent{
    height:30%;
    width:30%;
    background-color: aqua;
    border-radius: 1rem;
}

效果
这里写图片描述

这样就可以用百分比布局了,妈妈再也不用担心我不会换算rem 了

猜你喜欢

转载自blog.csdn.net/weixin_39168678/article/details/79789575