|
|
| 第1行： |
第1行： |
| {{#CSS:
| | <templatestyles src="栏目块.css" /> |
| /* 复制于https://otomad.wiki/Template:%E5%AD%90%E6%A0%8F%E7%9B%AE.css */
| |
| .childbox-image-more::before {
| |
| content: "";
| |
| opacity: 0;
| |
| transition:opacity 0.2s;
| |
| }
| |
| | |
| .childbox-image-more:hover::before {
| |
| content: "了解更多";
| |
| font-weight: bold;
| |
| position: absolute;
| |
| display: flex;
| |
| font-size: 20px;
| |
| color: black;
| |
| width: 100%;
| |
| height: 100%;
| |
| justify-content: center;
| |
| align-items: center;
| |
| z-index: 200;
| |
| opacity: 1;
| |
| background-color: rgba(255,255,255,0.7);
| |
| }
| |
| | |
| .childbox-image-more {
| |
| transform: scale(1);
| |
| transition:all 0.2s;
| |
| }
| |
| | |
| .childbox-image-more:hover {
| |
| transform: scale(1.01);
| |
| }
| |
| | |
| .childbox-image-more-child img {
| |
| width: 100%;
| |
| height: auto;
| |
| }
| |
| | |
| @media (min-width: 850px) {
| |
| .childbox-box {
| |
| margin:10px;
| |
| display:flex;
| |
| font-size: 0;
| |
| }
| |
| .childbox-image {
| |
| width:30%;
| |
| border-radius:6px;
| |
| overflow:hidden;
| |
| /*box-shadow: 0 3px 6px rgb(0 0 0 / 20%)*/;
| |
| cursor: default;
| |
| align-items: center;
| |
| margin:auto;
| |
| }
| |
| .childbox-text {
| |
| width:65%;
| |
| margin-left:20px;
| |
| }
| |
| .childbox-title {
| |
| flex:1;
| |
| font-weight:700;
| |
| font-size:20px;
| |
| margin-top:5px;
| |
| }
| |
| }
| |
| @media (max-width: 850px) {
| |
| .childbox-box {
| |
| margin:10px;
| |
| display:flex;
| |
| flex-direction: column;
| |
| font-size: 0;
| |
| }
| |
| .childbox-image {
| |
| width:100%;
| |
| border-radius:6px;
| |
| overflow:hidden;
| |
| /*box-shadow: 0 3px 6px rgb(0 0 0 / 20%)*/;
| |
| cursor: default;
| |
| align-items: center;
| |
| margin:auto;
| |
| }
| |
| .childbox-text {
| |
| width:100%;
| |
| }
| |
| .childbox-title {
| |
| text-align:center;
| |
| flex:1;
| |
| font-weight:700;
| |
| font-size:20px;
| |
| margin-top:5px;
| |
| }
| |
| }
| |
| }}
| |
| <div class="childbox-box"> | | <div class="childbox-box"> |
| <div class="childbox-image {{#if:{{{详情|}}}|childbox-image-more" data-more="{{{详情}}}"|"}}><div {{#if:{{{详情|}}}|class="childbox-image-more-child"}} style="pointer-events: none;">{{{图片|[[File:Soka Cafe.png|300px]]}}}</div></div> | | <div class="childbox-image {{#if:{{{详情|}}}|childbox-image-more" data-more="{{{详情}}}"|"}}><div {{#if:{{{详情|}}}|class="childbox-image-more-child"}} style="pointer-events: none;">{{{图片|[[File:Soka Cafe.png|300px]]}}}</div></div> |
2024年6月25日 (二) 00:08的版本
本Template复制于https://otomad.wiki/Template:%E5%AD%90%E6%A0%8F%E7%9B%AE
示例
Editorial Department
Editorial Department是HUIJIA FUN的建立均运营团体。
