59 lines
1.2 KiB
CSS
Executable File
59 lines
1.2 KiB
CSS
Executable File
/* css页面蓝图 */
|
|
|
|
/* 外部背景 */
|
|
html, body {
|
|
height: 100%;
|
|
width: 100%;
|
|
margin: 0; /*外边框*/
|
|
padding: 0; /*内边框*/
|
|
overflow: hidden; /* 防止滚动条 */
|
|
background-color: #333; /* 背景颜色 */
|
|
}
|
|
|
|
/* 内部容器 */
|
|
#app-canvas {
|
|
width: 1280px;
|
|
height: 800px;
|
|
|
|
background-color: rgba(147, 185, 255, 0.644);
|
|
border: 5px solid #0056b3; /* 定义边框 5px 实线 蓝色 */
|
|
/* transform-origin: 0 0; /* 定义缩放起点 左上角 */
|
|
|
|
position:fixed; /* 固定页面，不滚动 */
|
|
left: 50%; /* 调整左边缘位置到中央 */
|
|
top: 50%; /* 调整上边缘位置到中央 */
|
|
|
|
padding: 30px; /* 内部间距 30px */
|
|
|
|
|
|
}
|
|
|
|
header {
|
|
margin-bottom: 30px; /* 外部间距 30px */
|
|
text-align: center; /* 文字居中 */
|
|
}
|
|
|
|
h1 {
|
|
font-size: 48px;
|
|
color: #fff;
|
|
text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
|
|
}
|
|
|
|
#content-area {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
gap: 40px;
|
|
}
|
|
|
|
/* 自带 */
|
|
.box {
|
|
width: 500px;
|
|
height: 600px;
|
|
background-color: #ffffffcc;
|
|
border: 1px solid #ccc;
|
|
padding: 20px;
|
|
font-size: 20px;
|
|
text-align: left;
|
|
overflow: auto;
|
|
}
|