html - 为什么我没有得到正确的输出?
问题描述
HTML 标记:
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div class="container">
</div>
</body>
</html>
CSS:
body {
margin:0;
padding:0;
display:flex;
justify-content: center;
align-items: center;
}
.container {
background-color: green;
border:1px solid black;
width:80vw;
height:80vh;
}
在上面的代码中,我试图将我的 div 内容对齐以显示在中心,但它没有显示我应该进行哪些更改。
解决方案
您忘记为body
.
body {
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
这将解决您的问题。
推荐阅读
- spring - 当我将两个事务方法调用为嵌套时,Spring Boot 事务代理错误
- c++ - 键盘快捷键 Linux/Windows 的热键(启动应用程序)
- powershell - Powershell 选择某些输出
- java - AWT 和 Swing 组件未正确呈现
- python - 将列表中的 nan 值替换为元素数据类型之后的另一个值
- sql - 临时表既存在又不存在
- python - 如何从代码运行 tensorflow 对象检测 api (model_main_tf2)?
- cordova - 在应用中心添加应用进行代码推送时无法选择“Cordova”项
- javascript - 客户端 zip 多次获取
- linux-kernel - 当 dd 时,nvme 超时如何受 pcie 控制器“范围”dts 属性的影响