Repository: wangzhengya/cheatsheet
Branch: master
Commit: 46f3c6a0db32
Files: 6
Total size: 7.9 KB
Directory structure:
gitextract_jixmq0hy/
├── CNAME
├── README.md
├── _config.yml
└── ebook/
├── README.md
├── index.html
└── style.css
================================================
FILE CONTENTS
================================================
================================================
FILE: CNAME
================================================
zhengyaing.com
================================================
FILE: README.md
================================================
# 前端Cheat Sheet分享
一张图掌握一个知识点:[Github项目地址](https://github.com/wangzhengya/cheatsheet)
因为国内github网络问题，最近新增了Gitee的网址：[Gitee](https://gitee.com/zhengyaing/cheatsheet)
欢迎大家在Issues里给我提想学的知识点，也可以给我提一些改进的建议
## B站视频分享
[B站讲解视频地址](https://space.bilibili.com/503792864)
## 截图预览
## 百度云盘下载
链接: https://pan.baidu.com/s/1dT1Q0dft7nEY5wPkaM2CCw 提取码: 44mf
## BiliBili教学视频
【1】[一张图彻底掌握Grid网格布局](https://www.bilibili.com/video/BV1jA411h7sy/)
【2】[一张图掌握Flexbox弹性盒子布局](https://www.bilibili.com/video/BV1K64y1u7eb/)
【3】[一张图掌握BoxModel](https://www.bilibili.com/video/BV1ni4y1t7jK/)
【4】[一张图掌握Git](https://www.bilibili.com/video/BV1AZ4y1x7Do/)
【5】[一张图掌握CSS Selector](https://www.bilibili.com/video/BV1kk4y1R78f)
【6】[一张图掌握Head标签](https://www.bilibili.com/video/BV1ui4y1b7UW/)
【7】[一张图掌握Markdown](https://www.bilibili.com/video/BV1sz411z7qd/)
【8】[一张图掌握正则表达式](https://www.bilibili.com/video/BV1jT4y137qt/)
【9】[一张图掌握console](https://www.bilibili.com/video/BV1oz4y1R7yu/)
【10】[一张图掌握HTTP基础](https://www.bilibili.com/video/BV1Ua4y1e7rC/)
【11】[一张图入门SASS](https://www.bilibili.com/video/BV1e5411W7jd)
【12】[一张图掌握transform](https://www.bilibili.com/video/BV1Bz4y1r7V2/)
## 打赏
如果您觉得此项目对您有帮助，请我喝一杯咖啡☕️吧！
================================================
FILE: _config.yml
================================================
theme: jekyll-theme-leap-day
================================================
FILE: ebook/README.md
================================================
# ebook
前端编程电子书分享
================================================
FILE: ebook/index.html
================================================
Zhengyaing图书分享
================================================
FILE: ebook/style.css
================================================
.container {
width: 100%;
display: flex;
flex-wrap: wrap;
}
.book-container {
display: flex;
margin: 50px;
align-items: center;
justify-content: center;
perspective: 600px;
}
@keyframes initAnimation {
0% {
transform: rotateY(0deg);
}
100% {
transform: rotateY(-34deg);
}
}
.book {
margin-top: 40px;
width: 200px;
height: 300px;
position: relative;
transform-style: preserve-3d;
transform: rotateY(-34deg);
transition: 1s ease;
animation: 1s ease 0s 1 initAnimation;
}
.book:hover {
transform: rotateY(0deg);
}
.book > :first-child {
position: absolute;
top: 0;
left: 0;
background-color: red;
width: 200px;
height: 300px;
transform: translateZ(37.5px);
background-color: #01060f;
border-radius: 0 2px 2px 0;
box-shadow: 5px 5px 20px #666;
}
.book::before {
position: absolute;
content: " ";
background-color: blue;
left: 0;
top: 3px;
width: 73px;
height: 294px;
transform: translateX(159.5px) rotateY(90deg);
background: linear-gradient(
90deg,
#fff 0%,
#f9f9f9 5%,
#fff 10%,
#f9f9f9 15%,
#fff 20%,
#f9f9f9 25%,
#fff 30%,
#f9f9f9 35%,
#fff 40%,
#f9f9f9 45%,
#fff 50%,
#f9f9f9 55%,
#fff 60%,
#f9f9f9 65%,
#fff 70%,
#f9f9f9 75%,
#fff 80%,
#f9f9f9 85%,
#fff 90%,
#f9f9f9 95%,
#fff 100%
);
}
.book::after {
position: absolute;
top: 0;
left: 0;
content: " ";
width: 200px;
height: 300px;
transform: translateZ(-37.5px);
background-color: #01060f;
border-radius: 0 2px 2px 0;
box-shadow: -10px 0 50px 10px #666;
}
.jpeg)
