User:Koshiyakanata/style.css：修订间差异
Koshiyakanata（留言 | 贡献） 小 // Edit via Wikiplus |
Koshiyakanata（留言 | 贡献） 小 // Edit via Wikiplus |
||
| 第6行： | 第6行： | ||
margin-left: 51%; | margin-left: 51%; | ||
} | } | ||
/* 日历，测试 | /* 日历，测试 Start */ | ||
* {box-sizing:border-box;} | * {box-sizing:border-box;} | ||
ul {list-style-type: none;} | ul {list-style-type: none;} | ||
| 第87行： | 第87行： | ||
.weekdays li, .days li {width: 12.2%;} | .weekdays li, .days li {width: 12.2%;} | ||
} | } | ||
/* 日历，测试 End*/ | /* 日历，测试 End */ | ||
/* Link-box Start */ | |||
.link-box { | |||
position: relative; | |||
z-index: 2; | |||
display: inline-flex; | |||
align-items: stretch; | |||
min-height: 90px; | |||
width: 300px; | |||
border-radius: 6px; | |||
overflow: hidden; | |||
box-shadow: 0 2px 4px rgba(0,0,0,0.08),0 0 3px rgba(0,0,0,0.1); | |||
transition: box-shadow 0.2s ease-in-out; | |||
} | |||
.link-box:hover { | |||
z-index: 3; | |||
box-shadow: 0 8px 9px rgba(0,0,0,0.08), 0 0 6px rgba(0,0,0,0.1); | |||
} | |||
.link-box:active { | |||
z-index: 1; | |||
box-shadow: 0 1px 2px rgba(0,0,0,0.12), 0 0 1px 0 rgba(0,0,0,0.15); | |||
transition: all 0.04s ease-in; | |||
} | |||
.img-box { | |||
flex: 0 0 110px; | |||
position: relative; | |||
z-index: 1; | |||
overflow: hidden; | |||
mask-image: linear-gradient(90deg, black 90px, transparent); /*-webkit不让加，在内联样式里面加*/ | |||
} | |||
.img-box>img { | |||
position: absolute; | |||
left: 0; | |||
top: 0; | |||
width: 100% !important; | |||
height: 100% !important; | |||
object-fit: cover; | |||
transition: transform 0.4s cubic-bezier(0.32, 0, 0.4, 1); | |||
} | |||
.link-box:hover>.img-box>* { | |||
transform: scale(1.1); | |||
} | |||
.txt-box { | |||
flex-grow: 1; | |||
display: flex; | |||
flex-flow: column nowrap; | |||
justify-content: center; | |||
margin-left: -20px; | |||
padding: 7px 10px 7px 27px; | |||
z-index: 2; | |||
} | |||
.txt-box>.title { | |||
display: block; | |||
font-weight: bold; | |||
color: #222 | |||
} | |||
.txt-box>.text { | |||
display: block; | |||
color: #666; | |||
font-size: smaller; | |||
} | |||
.link-cover, .url-cover { | |||
position: absolute; | |||
top: 0; | |||
right: 0; | |||
bottom: 0; | |||
left: 0; | |||
z-index: 3; | |||
} | |||
/* Link-box End */ | |||