以下是一个简单的 HTML 和 CSS 星空特效代码。该代码使用了 CSS 动画和随机定位来创建闪烁的星星效果。请注意，这是一个非常基础的实现，你可以根据需要对其进行更多的优化和改进。
HTML 部分：
```html
```
CSS 部分 (`styles.css`):
```css
body {
margin: 0;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
background: #000; /* 背景设置为黑色 */
}
.star-sky {
position: relative;
width: 100%; /* 根据需要调整宽度 */
height: 100%; /* 根据需要调整高度 */
}
.star { /* 星星的基本样式 */
position: absolute; /* 定位星星的位置 */
background-color: white; /* 星星的颜色 */
width: 2px; /* 星星的大小 */
height: 2px; /* 星星的大小 */
animation-name: twinkle; /* 动画名称 */
animation-duration: 2s; /* 动画持续时间 */
animation-timing-function: ease-in-out; /* 动画的速度曲线 */
}
/* 随机位置的关键帧动画 */
@keyframes twinkle { /* 创建动画 */
0% { /* 动画开始时的样式 */
transform: translate(calc(random() * 100% - 5%), calc(random() * 100% - 5%)); /* 随机位置 */
opacity: 1; /* 开始时完全可见 */
}
50% { /* 动画中间时的样式 */
opacity: 0.3; /* 半透明效果 */
} /* 在此结束动画的效果可以更加平滑地实现闪烁效果 */ /* 如果希望每个星星有不同的闪烁效果，可以考虑添加更多关键帧或者使用JavaScript动态控制每个星星的动画 */ } /* 这里缺少了闭合关键帧的动画括号 */ ``` JavaScript部分可以使用一些方法创建动态的星星动画或者更多个性化的星空特效。你可能还需要额外的 CSS 或 JavaScript 来增强或控制闪烁的速度、颜色或其他效果。注意：在实际使用时可能需要做一些性能优化和调整以确保其在各种浏览器和设备上的性能表现良好。以上只是一个基本的星空特效示例。如果你想实现更复杂的星空效果，可能需要学习更多的HTML、CSS和JavaScript相关知识，并寻找专门的教程和资源来帮助你。