有兽档案馆
搜索
切换搜索
切换菜单
切换个人菜单
查看“Template:角色信息按键/style.css”的源代码
模板页面
阅读
查看源代码
查看历史
模板
讨论
更多操作
←
Template:角色信息按键/style.css
因为以下原因,您没有权限编辑该页面:
您所请求的操作,仅限具有
注册用户
、
自动确认用户
、
管理员
、
界面管理员
、
优质编辑者
、
确认用户
、
巡查员
、
档案理事员
等
权限
的
用户
执行。
若您尚未登录有兽档案馆账号,请您
登录
有兽档案馆账号后操作。
您尚未完成电子邮件确认,因此操作受限,请尽快
完成电子邮件确认
。
若您无法完成前述手续,请通过适当渠道请求管理员或档案理事员协助。
您可以查看和复制此页面的源代码。
若您无权编辑本页面,您可以
提出编辑请求
,提请有权限者代为编辑。
.characters-list { display: grid; grid-template-columns: repeat(auto-fill, 13em); grid-template-rows: auto; justify-content: space-between; justify-items: center; } .characters-list p{ display: none; } .character { display: flex; height: 4em; width: 12em; align-items: center; border: 1px #d9d9d9 solid; border-radius: 1em; background-color: rgba(255, 255, 255, .5); margin: 1em; box-shadow: 0 2px 0 rgba(0, 0, 0, .02); transition: border-color .2s; overflow: hidden; } .character:hover { border-color: #4096ff; box-shadow: 0 2px 0 rgba(64, 150, 255, .02); transition: all .2s; } .c-avatar a img { height: 4em; width: 4em; margin-right: 1em; transition: all .2s; border-radius: 1em 0 0 1em; transform: translateX(0); /*-webkit-mask: radial-gradient(black 50%, transparent 100%); 图片边缘柔滑效果 不加-webkit-不生效 加了不被模板样式支持 等过几年再看吧*/ mask: radial-gradient(black 30%, transparent 74%); } .character:hover .c-avatar a img { height: 6em; width: 6em; transition: all .2s; /*-webkit-mask: radial-gradient(black 30%, transparent 74%);*/ mask: radial-gradient(black 30%, transparent 74%); } .character-name-comic { font-size: 1.2em; font-family: var(--fonts-sans); word-break: keep-all; opacity: 1; z-index: 2; } .character-bg { z-index:8; position:absolute; margin-left: 65px; opacity: 0; height: 4em; } @media screen and (max-width: 768px) { .characters-list{ font-size:0.8em; grid-template-columns: repeat(auto-fill, 12em); } .character { width:11em; } .character:hover .c-avatar a img{ transform: translateX(2em); } .character:hover .character-name-comic{ opacity: 0; } .character:hover .character-name-anime{ opacity: 0; } .character-bg { margin-left: 0; } } @media screen and (max-width: 370px) { .characters-list{ font-size:0.8em; grid-template-columns: repeat(auto-fill, 10em); } .character { width:10em; } }
返回
Template:角色信息按键/style.css
。