This commit is contained in:
Wcowin 2025-05-11 16:19:22 +08:00
parent b5a36c5ce3
commit 85f609502e
6 changed files with 123 additions and 118 deletions

View File

@ -20,10 +20,11 @@ status: new
</center> --> </center> -->
<div class="flip-container"> <div class="flip-container">
<div class="image-container"> <div class="image-container">
<img src="https://picx.zhimg.com/v2-fb22186d2490043435a72876950492f5_1440w.jpg" alt="Front Image"> <img src="https://free.wmhua.cn/2025/05/09/681d7016db8dc.png" alt="Back Image">
<img src="https://pic4.zhimg.com/v2-a0456a5f527c1923f096759f2926012f_1440w.jpg" alt="Back Image"> <img src="https://free.wmhua.cn/2025/05/09/681d7015ed864.jpeg" alt="Front Image">
</div> </div>
</div> </div>
<style> <style>
@ -37,40 +38,43 @@ status: new
/* 对齐顶部 */ /* 对齐顶部 */
justify-content: flex-end; justify-content: flex-end;
/* 将文字放置右上角 */ /* 将文字放置右上角 */
} }
.image-container { .image-container {
position: relative; position: relative;
position: relative; position: relative;
width: 290px; width: 290px;
height: 290px; height: 290px;
} }
.image-container img { .image-container img {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 50%; object-fit: cover; /* 图片填满容器 */
display: block; border-radius: 50%;
transition: all 1s; border: 4px solid #ffffff; /* 白色边框 */
} box-shadow: 0 8px 24px rgba(14, 30, 37, 0.15); /* 阴影 */
.image-container img:first-child { backface-visibility: hidden; /* 隐藏背面 */
z-index: 1; transition: transform 0.6s ease-in-out; /* 仅对transform过渡 */
backface-visibility: hidden; }
} .image-container img:first-child {
.image-container img:last-child { z-index: 1;
z-index: 0; backface-visibility: hidden;
transform: rotateY(180deg); }
backface-visibility: hidden; .image-container img:last-child {
} z-index: 0;
.image-container:hover img:first-child { transform: rotateY(180deg);
transform: rotateY(180deg); backface-visibility: hidden;
z-index: 2; }
} .image-container:hover img:first-child {
.image-container:hover img:last-child { transform: rotateY(180deg);
transform: rotateY(0deg); z-index: 2;
z-index: 3; }
} .image-container:hover img:last-child {
transform: rotateY(0deg);
z-index: 3;
}
</style> </style>
@ -149,84 +153,80 @@ status: new
--- ---
## 我的履历 ## 我的履历
<html lang="en"> <section class="qualification section">
<body> <div class="qualification__container container">
<section class="qualification section"> <div class="qualification__tabs">
<div class="qualification__container container"> <div class="qualification__button button--flex qualification__active" data-target='#education'>
<div class="qualification__tabs"> <iconify-icon icon="fluent:hat-graduation-12-regular" class="qualification__icon"></iconify-icon>
<div class="qualification__button button--flex qualification__active" data-target='#education'> 来时路
<iconify-icon icon="fluent:hat-graduation-12-regular" class="qualification__icon"></iconify-icon> </div>
来时路 </div>
<div class="qualification__sections">
<!-- 教育经历时间线 -->
<div class="qualification__content qualification__active" data-content id="education">
<!-- 时间线项目 -->
<div class="qualification__data">
<div>
<h3 class="qualification__title">漯河高中</h3>
<span class="qualification__subtitle">平凡的三年</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">2018 - 2021</span>
</div>
</div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div>
</div> </div>
</div> <div class="qualification__data">
<div class="qualification__sections"> <div></div>
<!-- 教育经历时间线 --> <div>
<div class="qualification__content qualification__active" data-content id="education"> <span class="qualification__rounder"></span>
<!-- 高中 --> <span class="qualification__line"></span>
<div class="qualification__data"> </div>
<div> <div>
<h3 class="qualification__title">漯河高中</h3> <h3 class="qualification__title">CTBU</h3>
<span class="qualification__subtitle">平凡的三年</span> <span class="qualification__subtitle">电子信息工程专业学士</span>
<div class="qualification__calendar"> <div class="qualification__calendar">
<font color= #757575><iconify-icon icon="tabler:calendar"></iconify-icon> <iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
2018 - 2021</font> <span class="qualification__date">2021 - 2025</span>
</div>
</div>
<div>
<span class="qualification__rounder"></span>
<span class="qualification__line"></span>
</div> </div>
</div> </div>
<div class="qualification__data"> </div>
<div></div> <div class="qualification__data">
<div> <div>
<span class="qualification__rounder"></span> <h3 class="qualification__title">家里蹲大学</h3>
<span class="qualification__line"></span> <span class="qualification__subtitle">密码学硕士研究生</span>
</div> <div class="qualification__calendar">
<div> <iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<h3 class="qualification__title">CTBU</h3> <span class="qualification__date">2026 - 2029</span>
<span class="qualification__subtitle">电子信息工程专业学士</span>
<div class="qualification__calendar">
<font color= #757575><iconify-icon icon="tabler:calendar"></iconify-icon>
2021 - 2025</font>
</div>
</div> </div>
</div> </div>
<div class="qualification__data"> <div>
<div> <span class="qualification__rounder"></span>
<h3 class="qualification__title">家里蹲大学</h3> <span class="qualification__line"></span>
<span class="qualification__subtitle">密码学硕士研究生</span> </div>
<div class="qualification__calendar"> </div>
<font color= #757575><iconify-icon icon="tabler:calendar"></iconify-icon> <div class="qualification__data">
2026 - 2029</font> <div></div>
</div> <div>
</div> <span class="qualification__rounder"></span>
<div> <span class="qualification__line"></span>
<span class="qualification__rounder"></span> </div>
<span class="qualification__line"></span> <div>
<h3 class="qualification__title">未完待续</h3>
<span class="qualification__subtitle">于道各努力,千里自同风</span>
<div class="qualification__calendar">
<iconify-icon icon="tabler:calendar" aria-hidden="true"></iconify-icon>
<span class="qualification__date">Before - After</span>
</div> </div>
</div> </div>
<div class="qualification__data"> </div>
<div></div> </div>
<div> </div>
<span class="qualification__rounder"></span> </div>
<span class="qualification__line"></span> </section>
</div>
<div>
<h3 class="qualification__title">未完待续</h3>
<span class="qualification__subtitle">于道各努力,千里自同风</span>
<div class="qualification__calendar">
<font color= #757575><iconify-icon icon="tabler:calendar"></iconify-icon>
Before - After</font>
</div>
</div>
</div>
</div> <!-- 闭合 qualification__content -->
</div> <!-- 闭合 qualification__sections -->
</div> <!-- 闭合 qualification__container -->
</section>
</body>
</html>
<HR style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#608DBD,direction:145,strength:15)" width="100%" color=#608DBD SIZE=1> <HR style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#608DBD,direction:145,strength:15)" width="100%" color=#608DBD SIZE=1>
@ -241,7 +241,7 @@ status: new
!!! pied-piper1 "About me" !!! pied-piper1 "About me"
- [x] Hey, I'm [Wcowin](https://wcowin.work/VitePress/){target=“_blank”}~ - [x] Hey, I'm [Wcowin](https://wcowin.work/VitePress/){target=“_blank”}~
- [x] 咖啡重度爱好者 - [x] 咖啡重度爱好者
- [x] 热爱(xiā)折腾技术/Math目前的研究领域是[密码学](https://ctf-wiki.org/crypto/introduction/){target=“_blank”} - [x] 热爱(xiā)折腾技术/Math目前的研究领域是[密码学](../blog/Cryptography/index.md)
- [x] 读书明志可识春秋;诗词爱好者;喜欢村上春树;擅长羽毛球 - [x] 读书明志可识春秋;诗词爱好者;喜欢村上春树;擅长羽毛球
- [x] 清醒,知趣,明得失,知进退 - [x] 清醒,知趣,明得失,知进退

View File

@ -11,7 +11,7 @@ tags:
<iframe src="../个人简历.pdf (相对地址)" width="100%" height="800px" style="border: 1px solid #ccc; overflow: auto;"></iframe> <iframe src="../个人简历.pdf (相对地址)" width="100%" height="800px" style="border: 1px solid #ccc; overflow: auto;"></iframe>
``` ```
<img width="1178" alt="image" src="https://github.com/user-attachments/assets/5b511fe9-9a3b-4bff-b54c-37d92f00306b" /> <img width="1178" alt="image" src="https://s1.imagehub.cc/images/2025/05/11/af422a556586fa0ed42f7adcf5a694ae.png" />
我的完整代码: 我的完整代码:

View File

@ -19,11 +19,11 @@ Markdown 编写的文档可以导出 HTML 、Word、图像、PDF、Epub 等多
一些Markdown文档创作工具 一些Markdown文档创作工具
<ul> <ul>
<li><strong>Mac:</strong> <a href="/tools/macdown/">MacDown</a>, <a href="/tools/ia-writer/">iA Writer</a><a href="/tools/marked-2/">Marked 2</a></li> <li><strong>Mac:</strong> <a href="https://macdown.uranusjr.com/">MacDown</a>, <a href="https://ia.net/writer">iA Writer</a><a href="https://marked2.com/">Marked 2</a></li>
<li><strong>iOS / Android:</strong> <a href="/tools/ia-writer/">iA Writer</a></li> <li><strong>iOS / Android:</strong> <a href="https://ia.net/writer">iA Writer</a></li>
<li><strong>Windows:</strong> <a href="https://wereturtle.github.io/ghostwriter/">ghostwriter</a><a href="https://markdownmonster.west-wind.com/">Markdown Monster</a></li> <li><strong>Windows:</strong> <a href="https://wereturtle.github.io/ghostwriter/">ghostwriter</a><a href="https://markdownmonster.west-wind.com/">Markdown Monster</a></li>
<li><strong>Linux:</strong> <a href="https://github.com/retext-project/retext">ReText</a><a href="https://wereturtle.github.io/ghostwriter/">ghostwriter</a></li> <li><strong>Linux:</strong> <a href="https://github.com/retext-project/retext">ReText</a><a href="https://wereturtle.github.io/ghostwriter/">ghostwriter</a></li>
<li><strong>Web:</strong> <a href="/tools/dillinger/">Dillinger</a><a href="/tools/stackedit/">StackEdit</a></li> <li><strong>Web:</strong> <a href="https://dillinger.io/">Dillinger</a><a href="https://stackedit.io/">StackEdit</a></li>
</ul> </ul>
## 最常用 ## 最常用
@ -337,7 +337,9 @@ markdown文本内的连续两个或多个回车会被替换为一个回车
``` ```
下面我们来认识一下二次函数$$y=ax^2+bx+c$$ 下面我们来认识一下二次函数$$y=ax^2+bx+c$$
``` ```
下面我们来认识一下二次函数$$y=ax^2+bx+c$$ 下面我们来认识一下二次函数
$$y=ax^2+bx+c$$
- - - - - -

View File

@ -235,4 +235,5 @@ body::before {
display: none; /* 在手机端隐藏网格效果 */ display: none; /* 在手机端隐藏网格效果 */
} }
} }
</style> </style>

View File

@ -106,13 +106,14 @@ nav:
- 博客: - 博客:
- index: blog/index.md - index: blog/index.md
- 友链: - 友链:
- 友链: about/link.md - 友链: link.md
- 关于: - 关于:
- 作者个人简介: about/geren.md - 作者个人简介: about/geren.md
- 个人简历: about/resume.md - 个人简历: about/resume.md
- 支持作者: about/zcw.md - 支持作者: about/zcw.md
- 功能测试: about/test.md - 功能测试: about/test.md
- 个人博客: https://wcowin.work - 个人博客: https://wcowin.work
- 个人简介: https://wcowin.work/Personal-Profile/#
- 使用本主题: https://github.com/new?template_name=Mkdocs-Wcowin&template_owner=Wcowin - 使用本主题: https://github.com/new?template_name=Mkdocs-Wcowin&template_owner=Wcowin
copyright: Copyright &copy; 2022~2025 Wcowin # 左下角的版权声明 copyright: Copyright &copy; 2022~2025 Wcowin # 左下角的版权声明
@ -277,8 +278,9 @@ extra_javascript:
# - javascripts/extra.js #自定义javascript # - javascripts/extra.js #自定义javascript
- https://cdn.jsdelivr.net/gh/Wcowin/Wcowin.github.io@main/docs/javascripts/extra.js # extra的cdn - https://cdn.jsdelivr.net/gh/Wcowin/Wcowin.github.io@main/docs/javascripts/extra.js # extra的cdn
# - javascripts/mathjax.js #Latex支持 # - javascripts/mathjax.js #Latex支持
- https://github.com/Wcowin/Wcowin.github.io/blob/main/docs/javascripts/mathjax.js #Latex支持的CDN - javascripts/mathjax.js #Latex支持的CDN
- https://polyfill.io/v3/polyfill.min.js?features=es6 #Latex支持 # - https://polyfill.io/v3/polyfill.min.js?features=es6 #Latex支持
- https://unpkg.com/mathjax@3/es5/tex-mml-chtml.js
- https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js #Latex支持 - https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js #Latex支持
# - ckplayer/js/ckplayer.js #播放器配置 # - ckplayer/js/ckplayer.js #播放器配置
# - https://cdn.jsdelivr.net/npm/gitalk@latest/dist/gitalk.min.js #gitalk支持 # - https://cdn.jsdelivr.net/npm/gitalk@latest/dist/gitalk.min.js #gitalk支持
@ -286,7 +288,7 @@ extra_javascript:
- https://cdn.jsdelivr.net/gh/Wcowin/Wcowin.github.io@main/docs/javascripts/view.js - https://cdn.jsdelivr.net/gh/Wcowin/Wcowin.github.io@main/docs/javascripts/view.js
extra_css: extra_css:
# - stylesheets/extra.css # 自定义CSS - stylesheets/extra.css # 自定义CSS
- https://cdn.jsdelivr.net/gh/Wcowin/Mkdocs-Wcowin@main/docs/stylesheets/extra.css - https://cdn.jsdelivr.net/gh/Wcowin/Mkdocs-Wcowin@main/docs/stylesheets/extra.css
# - stylesheets/link.css #友链配置 # - stylesheets/link.css #友链配置
- https://cdn.jsdelivr.net/gh/Wcowin/Wcowin.github.io@main/docs/stylesheets/link.css #友链CDN - https://cdn.jsdelivr.net/gh/Wcowin/Wcowin.github.io@main/docs/stylesheets/link.css #友链CDN