Skip to content

G
gitcode.host

GitCode / gitcode.host

通知 5
Star 1
Fork 0
G
gitcode.host
提交 d10a28aa 编写于 作者: C csdn
浏览文件
操作

feat:添加404文件等

上级 9a1f8a16
展开全部 隐藏空白更改
内联 并排
Showing with 754 addition and 588 deletion
css/index.css 0 → 100644
浏览文件 @ d10a28aa
html,
body {
padding: 0;
margin: 0;
overflow-x: hidden;
}
@keyframes circle {
0% {
opacity: 0.6;
width: 100%;
height: 100%;
}
25% {
opacity: 0.4;
width: 115%;
height: 115%;
}
50% {
opacity: 0.2;
width: 130%;
height: 130%;
}
75% {
opacity: 0.1;
width: 145%;
height: 145%;
}
100% {
opacity: 0;
width: 160%;
height: 160%;
}
}
.pages_index img {
display: block;
}
.pages_index a {
text-decoration: none;
}
.pages_index ul,
.pages_index li {
list-style: none;
}
.pages_index .w {
max-width: 1440px;
margin: 0 auto;
margin-top: -138px;
position: relative;
z-index: 2;
}
.pages_index .w2 {
max-width: 1024px;
margin: 0 auto;
}
.pages_index .banner {
position: relative;
}
.pages_index .banner .codechina {
position: absolute;
width: 8.2%;
height: 4.2%;
top: 2.8%;
left: 11.6%;
}
.pages_index .banner .help {
position: absolute;
width: 10%;
height: 4.2%;
top: 2.8%;
left: 23%;
}
.pages_index .title {
padding: 0 270px;
box-sizing: border-box;
background: url(../img/title_l.png) left no-repeat, url(../img/title_r.png) right no-repeat;
width: max-content;
margin: 80px auto;
font-size: 40px;
font-weight: 500;
margin-top: 120px;
}
.pages_index p {
font-size: 25px;
color: #172853;
text-align: center;
margin-bottom: 60px;
}
.pages_index .tab {
border: 2px solid #4e5595;
border-radius: 8px;
width: 650px;
height: 64px;
margin: 0 auto;
line-height: 64px;
display: flex;
justify-content: space-between;
}
.pages_index .tab .item {
color: #172853;
font-size: 25px;
width: 50%;
text-align: center;
height: 100%;
cursor: pointer;
}
.pages_index .tab .item.active {
background: #4e5595;
color: #fff;
}
.pages_index h3 {
text-align: center;
font-size: 30px;
color: #172853;
margin: 100px 0;
}
.pages_index .project_list {
display: flex;
justify-content: space-between;
}
.pages_index .project_list .item {
display: flex;
}
.pages_index .project_list .item img {
width: 200px;
height: 272px;
border-radius: 8px;
}
.pages_index .project_list .item ul {
flex: 1;
padding: 0 32px;
margin: 0;
}
.pages_index .project_list .item ul li {
font-size: 25px;
}
.pages_index .project_list .item ul li + li {
margin-top: 33px;
}
.pages_index .project_list .item ul .bookname {
font-size: 30px;
font-weight: 500;
color: #172853;
}
.pages_index .project_list .item ul a,
.pages_index .project_list .item ul span {
margin-left: 24px;
}
.pages_index .project_list .item ul a {
color: #409eff;
text-decoration: underline;
}
.pages_index .project_list .item ul .desc {
font-size: 16px;
color: #4c4c4c;
padding: 18px 22px;
background: rgba(251, 239, 216, 0.5);
border-radius: 8px;
}
.pages_index .steps {
margin-top: 100px;
}
.pages_index .steps .step_item {
border-left: 3px solid #4e5595;
position: relative;
padding-left: 70px;
color: #172853;
padding-bottom: 100px;
}
.pages_index .steps .step_item.hidden {
display: none;
}
.pages_index .steps .step_item:last-child {
border: none;
}
.pages_index .steps .step_item::before,
.pages_index .steps .step_item::after {
display: block;
content: "";
height: 1px;
}
.pages_index .steps .step_item img {
border: 2px solid #409eff;
border-radius: 8px;
margin-top: 50px;
}
.pages_index .steps .step_item .index {
position: absolute;
width: 64px;
height: 64px;
line-height: 64px;
text-align: center;
font-size: 30px;
color: #fff;
top: 0px;
left: -32px;
background: #4e5595;
border-radius: 50%;
}
.pages_index .steps .step_item h4 {
font-size: 25px;
margin: 14px 0;
}
.pages_index .steps .step_item p {
font-size: 20px;
text-align: left;
margin: 40px 0;
}
.pages_index .steps .step_item code {
display: block;
color: #fff;
background: #3d3d3d;
font-size: 20px;
position: relative;
border-radius: 8px;
border: 1px solid #3d3d3d;
overflow: hidden;
padding: 48px 20px 20px;
line-height: 36px;
}
.pages_index .steps .step_item code::before {
position: absolute;
content: "";
width: 100%;
height: 28px;
background: #c4c4c4;
top: 0;
left: 0;
}
.pages_index .visit {
width: 156px;
margin: 30px auto;
position: relative;
}
.pages_index .visit img {
width: 156px;
height: 156px;
border-radius: 50%;
cursor: pointer;
position: relative;
z-index: 9;
}
.pages_index .visit .circle {
width: 100%;
height: 100%;
border-radius: 50%;
border: 5px solid #4e5595;
box-sizing: border-box;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
animation: circle 4s linear infinite;
}
.pages_index .visit .circle.circle2 {
animation-delay: 1.3s;
}
.pages_index .visit .circle.circle3 {
animation-delay: 2.5s;
}
.pages_index .buttons {
display: flex;
justify-content: space-between;
margin: 100px auto 200px;
}
.pages_index .buttons .btn {
width: 288px;
height: 64px;
line-height: 64px;
text-align: center;
font-size: 25px;
color: #172853;
border: 2px solid #4e5595;
border-radius: 8px;
display: block;
box-sizing: border-box;
cursor: pointer;
font-weight: 500;
}
.pages_index .buttons .btn.active {
border: none;
background: linear-gradient(90deg, #78568c 0%, #4e5595 100%);
color: #fff;
}
.pages_index .footer {
width: 100%;
text-align: center;
color: #fff;
font-size: 20px;
height: 102px;
line-height: 102px;
background: #4e5595;
}
css/index.less 0 → 100644
浏览文件 @ d10a28aa
html,
body {
padding: 0;
margin: 0;
overflow-x: hidden;
}
@keyframes circle {
0% {
opacity: 0.6;
width: 100%;
height: 100%;
}
25% {
opacity: 0.4;
width: 115%;
height: 115%;
}
50% {
opacity: 0.2;
width: 130%;
height: 130%;
}
75% {
opacity: 0.1;
width: 145%;
height: 145%;
}
100% {
opacity: 0;
width: 160%;
height: 160%;
}
}
.pages_index {
img {
display: block;
}
a {
text-decoration: none;
}
ul,
li {
list-style: none;
}
.w {
max-width: 1440px;
margin: 0 auto;
margin-top: -138px;
position: relative;
z-index: 2;
}
.w2 {
max-width: 1024px;
margin: 0 auto;
}
.banner {
position: relative;
.codechina {
position: absolute;
width: 8.2%;
height: 4.2%;
top: 2.8%;
left: 11.6%;
}
.help {
position: absolute;
width: 10%;
height: 4.2%;
top: 2.8%;
left: 23%;
}
}
.title {
padding: 0 270px;
box-sizing: border-box;
background: url(../img/title_l.png) left no-repeat,
url(../img/title_r.png) right no-repeat;
width: max-content;
margin: 80px auto;
font-size: 40px;
font-weight: 500;
margin-top: 120px;
}
p {
font-size: 25px;
color: #172853;
text-align: center;
margin-bottom: 60px;
}
.tab {
border: 2px solid #4e5595;
border-radius: 8px;
width: 650px;
height: 64px;
margin: 0 auto;
line-height: 64px;
display: flex;
justify-content: space-between;
.item {
color: #172853;
font-size: 25px;
width: 50%;
text-align: center;
height: 100%;
cursor: pointer;
&.active {
background: #4e5595;
color: #fff;
}
}
}
h3 {
text-align: center;
font-size: 30px;
color: #172853;
margin: 100px 0;
}
.project_list {
display: flex;
justify-content: space-between;
.item {
display: flex;
img {
width: 200px;
height: 272px;
border-radius: 8px;
}
ul {
flex: 1;
padding: 0 32px;
margin: 0;
li {
font-size: 25px;
& + li {
margin-top: 33px;
}
}
.bookname {
font-size: 30px;
font-weight: 500;
color: #172853;
}
a,
span {
margin-left: 24px;
}
a {
color: #409eff;
text-decoration: underline;
}
.desc {
font-size: 16px;
color: #4c4c4c;
padding: 18px 22px;
background: rgba(251, 239, 216, 0.5);
border-radius: 8px;
}
}
}
}
.steps {
margin-top: 100px;
.step_item {
border-left: 3px solid #4e5595;
position: relative;
padding-left: 70px;
color: #172853;
padding-bottom: 100px;
&.hidden {
display: none;
}
&:last-child {
border: none;
}
&::before,
&::after {
display: block;
content: "";
height: 1px;
}
img {
border: 2px solid #409eff;
border-radius: 8px;
margin-top: 50px;
}
.index {
position: absolute;
width: 64px;
height: 64px;
line-height: 64px;
text-align: center;
font-size: 30px;
color: #fff;
top: 0px;
left: -32px;
background: #4e5595;
border-radius: 50%;
}
h4 {
font-size: 25px;
margin: 14px 0;
}
p {
font-size: 20px;
text-align: left;
margin: 40px 0;
}
code {
display: block;
color: #fff;
background: #3d3d3d;
font-size: 20px;
position: relative;
border-radius: 8px;
border: 1px solid #3d3d3d;
overflow: hidden;
padding: 48px 20px 20px;
line-height: 36px;
&::before {
position: absolute;
content: "";
width: 100%;
height: 28px;
background: #c4c4c4;
top: 0;
left: 0;
}
}
}
}
.visit {
width: 156px;
margin: 30px auto;
position: relative;
img {
width: 156px;
height: 156px;
border-radius: 50%;
cursor: pointer;
position: relative;
z-index: 9;
}
.circle {
width: 100%;
height: 100%;
border-radius: 50%;
border: 5px solid #4e5595;
box-sizing: border-box;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
animation: circle 4s linear infinite;
&.circle2 {
animation-delay: 1.3s;
}
&.circle3 {
animation-delay: 2.5s;
}
}
}
.buttons {
display: flex;
justify-content: space-between;
margin: 100px auto 200px;
.btn {
width: 288px;
height: 64px;
line-height: 64px;
text-align: center;
font-size: 25px;
color: #172853;
border: 2px solid #4e5595;
border-radius: 8px;
display: block;
box-sizing: border-box;
cursor: pointer;
font-weight: 500;
&.active {
border: none;
background: linear-gradient(90deg, #78568c 0%, #4e5595 100%);
color: #fff;
}
}
}
.footer {
width: 100%;
text-align: center;
color: #fff;
font-size: 20px;
height: 102px;
line-height: 102px;
background: #4e5595;
}
}
index.html
浏览文件 @ d10a28aa
此差异已折叠。
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或