
react 里面的东西居中
react 里面的东西居中。
·
react 里面的东西居中
import React from 'react';
import './CenteredComponent.css';
const CenteredComponent = (props) => {
return (
<div className="centered-component">
{props.children}
</div>
);
};
export default CenteredComponent;
.centered-component {
display: flex;
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
height: 100vh; /* 使用视窗高度作为容器高度,实现上下居中 */
width: 100%; /* 使用视窗宽度作为容器宽度,实现左右居中 */
}
<CenteredComponent>
<div>
我被居中了
</div>
</CenteredComponent>
更多推荐
所有评论(0)