styles.css

* {
    box-sizing: border-box;
}

/* styles.css */

body {
    font-family: Arial, sans-serif;
    /* 使用背景图片 */
    /*background-image: url('背景.png');
    /* 设置背景颜色，以防图片未加载时显示 */
    background-color: #f0f0f0;
    /* 设置背景图片的其他属性 */
    /*background-repeat: no-repeat; /* 不重复背景图片 */
    background-size: cover;       /* 背景图片覆盖整个容器 */
}

#bj {
  position: fixed; /* 或absolute */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1; /* 确保背景位于所有其他内容之下 */
  background-image: url('your-background-url');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#content {
  position: relative;
  z-index: 1; /* 确保内容位于背景之上 */
}
header {
    background-color: #21499a;
    color: white;
    padding: 1em;
    text-align: center;
}
header nav ul {
    list-style: none;
    padding: 0;
}

header nav ul li {
    display: inline;
    margin-right: 1em;
}

header nav ul li a {
    color: white;
    text-decoration: none;
}

main {
    max-width: 800px;
    margin: auto;
    padding: 1em;
}

.feature, .screenshot {
    margin-bottom: 1em;
}

.feature img, .screenshot img {
    width: 100%;
    height: auto;
}


video {
    width: 100%; /* 视频宽度与容器相同 */
    height: auto; /* 高度自动调整 */
}

.footer-links {
    text-align: center;
}

.footer-links ul {
    list-style-type: none;
    padding: 0;
}

.footer-links li {
    display: inline-block;
    color: white;
    margin-right: 10px;
}

.footer-links a {
    color: #666;
    text-decoration: none;
}
footer {
    background-color: #21499a;
    color: white;
    text-align: center;
    padding: 1em;
}

button {
    background-color: #9A347C;
    color: white;
    border: none;
    padding: 0.5em 1em;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

button:hover {
    background-color: #9A347C;
}