用户:Sam0324/Sandbox.css:修订间差异
来自Limbo Wiki
小无编辑摘要 |
小无编辑摘要 |
||
第1行: | 第1行: | ||
.body { | .body { | ||
margin:0; | |||
padding:10px; | padding:10px; | ||
width: | width:100%; | ||
height: | height:100%; | ||
background-color:black; | background-color:black; | ||
} | } | ||
.data { | .data { | ||
margin:0 auto; | margin:0 auto; | ||
border:5px solid white; | border:5px solid white; | ||
} | } | ||
第23行: | 第23行: | ||
color:white; | color:white; | ||
border-bottom:3px solid white; | border-bottom:3px solid white; | ||
float: left; | |||
} | } | ||
.frame{ | .frame{ | ||
第29行: | 第30行: | ||
padding-top: 30px; | padding-top: 30px; | ||
padding-bottom: 30px; | padding-bottom: 30px; | ||
} | |||
.frame:after{ | |||
content: ""; | |||
display: block; | |||
clear: both; | |||
} | |||
@media screen and (max-width:236px) { | |||
.frame{ | |||
width:220px; | |||
} | |||
.data{ | |||
width:226px; | |||
} | |||
} | |||
@media screen and (min-width:236px) { | |||
.frame{ | |||
width:220px; | |||
} | |||
.data{ | |||
width:226px; | |||
} | |||
} | } | ||
@media screen and (min-width:450px) { | @media screen and (min-width:450px) { | ||
.frame{ | .frame{ | ||
width:440px; | width:440px; | ||
} | |||
.data{ | |||
width:446px; | |||
} | } | ||
} | } | ||
@media screen and (min-width:670px) { | @media screen and (min-width:670px) { | ||
.frame{ | .frame{ | ||
width: | width:662px; | ||
} | |||
.data{ | |||
width:666px; | |||
} | } | ||
} | } | ||
第43行: | 第71行: | ||
.frame{ | .frame{ | ||
width:880px; | width:880px; | ||
} | |||
.data{ | |||
width:886px; | |||
} | } | ||
} | } | ||
第48行: | 第79行: | ||
.frame{ | .frame{ | ||
width:1100px; | width:1100px; | ||
} | |||
.data{ | |||
width:1106px; | |||
} | } | ||
} | } |
2022年3月20日 (日) 13:22的版本
.body { margin:0; padding:10px; width:100%; height:100%; background-color:black; } .data { margin:0 auto; border:5px solid white; } .chapter { background-image: linear-gradient(rgba(128,128,128,0), rgba(128,128,128,1)); background-color: black; } .button { display: inline-block; width:200px; margin-right:10px; margin-left:10px; height:6em; background-image: linear-gradient(rgba(120,128,135,0), rgba(120,128,135,1)); color:white; border-bottom:3px solid white; float: left; } .frame{ width:220px; margin:0 auto; padding-top: 30px; padding-bottom: 30px; } .frame:after{ content: ""; display: block; clear: both; } @media screen and (max-width:236px) { .frame{ width:220px; } .data{ width:226px; } } @media screen and (min-width:236px) { .frame{ width:220px; } .data{ width:226px; } } @media screen and (min-width:450px) { .frame{ width:440px; } .data{ width:446px; } } @media screen and (min-width:670px) { .frame{ width:662px; } .data{ width:666px; } } @media screen and (min-width:890px) { .frame{ width:880px; } .data{ width:886px; } } @media screen and (min-width:1120px) { .frame{ width:1100px; } .data{ width:1106px; } }