说明：KZHomePage是静态的个人主页网站，可以将代码托管在Github、Gitee、Gitlab、Coding、Gitcode等仓库中建立静态网站，个人主页可以分享有趣和酷的项目，在个人主页上直观的展示和快捷的访问项目；
KZHomePage主页源码：
KZHomePage主页演示：
KZHomePage-美化主页源码：
KZHomePage-美化主页演示：
1. 美化二次元卡片圆角、卡片圆角阴影、卡片透明度、卡片边缘发光；
修改style.css样式文件，style.css文件路径：在KZHomePage-main\static文件夹里
第67行，在.card中，添加卡片圆角、卡片圆角阴影、卡片透明度；
.card { border: none; padding: 50px 30px 0px; border-radius: 0px 6px 6px 0px; /* 卡片圆角：左上、右上、右下、左下 */ box-shadow: 0px 0px 2px 3px rgb(203, 221, 232); /* 圆角阴影 */ background-color:rgba(255, 255, 255, 0.6); /* 卡片透明度 */}第74行，在.container中，添加卡片透明度(已注释，在这行中添加透明度会出现文字被同化透明，已放置在第67行的.card中用rgba体现)；
.container { opacity: 0.85; /* 卡片透明度 */ position: relative; top: 50%; transform: translateY(-50%);}第81行，在.my-card中，添加卡片边缘发光代码；
.my-card { /* box-shadow: 0px 5px 15px 5px rgb(203, 221, 232); */ box-shadow: 0px 3px 10px 3px rgb(203, 221, 232); /* 卡片边缘发光 */}第91行，在.btn中，修改按钮图标圆角
.btn { border-radius: 3px; /* 修改按钮图标圆角 */ margin: 5px 0; width: 100%; padding: 12px 40px; transition: ease;}第151行，在.photo-bg中，添加卡片圆角、卡片圆角阴影、左侧背景卡片透明度；
.photo-bg { /* background-image: url(assets/background.jpg); */ background-image: url(); border-radius: 6px 0px 0px 6px; /* 卡片圆角：左上、右上、右下、左下 */ box-shadow: 0px 0px 2px 3px rgb(203, 221, 232); /* 圆角阴影 */ opacity: 0.85; /* 左侧背景卡片透明度 */ background-position: center; background-repeat: no-repeat; background-size: cover;}2. 添加鼠标文字特效；
修改index.html主页文件，index.html文件路径：在KZHomePage-main文件夹里；
在html标签内，添加鼠标特效；
3. 修改图标大小
修改index.html主页文件，index.html文件路径：在KZHomePage-main文件夹里；
.social .fa { font-size: 16px; /* 定义fontawesome图标大小*/}@media{ .social .fa { font-size: 16px; /* 浏览器打开开发模式时，定义fontawesome图标大小*/ } }依赖项目
版权声明
原始模板来源：
本文地址：https://caijingdemo.com/changshi/84526.html