<style> .wrapper { display: flex; justify-content: center; align-items: center; height: 100vh; } .content { text-align: center; } .content p { font-size: 24px; font-weight: bold; } .content img { max-width: 100%; max-height: 100%; } </style> <div class="wrapper"> <div class="content"> <p>静夜思</p> <p>唐.李白</p> <p>床前明月光,疑是地上霜。</p> <p>举头望明月,低头思故乡。</p></div> <img src="C:\Users\liao\Desktop\11\1.jpg"> </div> </div> <!DOCTYPE html>添加一个边框
时间: 2023-06-27 22:01:19 浏览: 42
你可以在 `.wrapper` 和 `.content` 的样式中添加 `border: 1px solid black;` 来给整个对话框添加一个边框,如下所示:
```
<style>
.wrapper {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
border: 1px solid black; /* 添加边框 */
}
.content {
text-align: center;
border: 1px solid black; /* 添加边框 */
}
.content p {
font-size: 24px;
font-weight: bold;
}
.content img {
max-width: 100%;
max-height: 100%;
}
</style>
<div class="wrapper">
<div class="content">
<p>静夜思</p>
<p>唐.李白</p>
<p>床前明月光,疑是地上霜。</p>
<p>举头望明月,低头思故乡。</p>
</div>
<img src="C:\Users\liao\Desktop\11\1.jpg">
</div>
```
注意,这只是添加了一个简单的黑色实线边框,你可以根据需要进行调整。