Участник:Richard Jones/Community/Creative Content
Внешний вид
{{#css: .wrap table {
width: 100%; border-collapse: collapse; margin-bottom: 40px;
}
table.grey > tr > th, table.grey > tr > td, table.grey > * > tr > th, table.grey > * > tr > td {
background-color: rgba(0, 0, 0, 0.1);
}
.wrap td {
padding: 0; width: 200px; transition: box-shadow linear 0.15s; -webkit-transition: box-shadow linear 0.15s; -o-transition: box-shadow linear 0.15s; -moz-transition: box-shadow linear 0.15s; font-weight: bold;
}
.wrap td:hover {
box-shadow: inset 0px 2px 20px -5px black; border: 0;
}
.wrap td > img {
max-width: 60px; max-height: 60px; transition: transform linear 0.15s; -webkit-transition: transform linear 0.15s; -o-transition: transform linear 0.15s; -moz-transition: transform linear 0.15s;
}
.wrap td:hover > img {
transform: scale(1.3);
}
.wrap td > a {
display: block; transition: font-size linear 0.15s; -webkit-transition: font-size linear 0.15s; -o-transition: font-size linear 0.15s; -moz-transition: font-size linear 0.15s; color: black; text-decoration: none;
}
.wrap td > a > span {
position: relative; color: black; text-decoration: none; padding-bottom: 3px;
}
.wrap td > a > span:before {
content: ""; position: absolute; width: 100%; height: 2px; bottom: 0; left: 0; background-color: black; visibility: hidden; transform: scaleX(0); transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; -o-transition: all ease-in-out 0.3s; -moz-transition: all ease-in-out 0.3s;
}
.wrap td > a:hover > span:before {
visibility: visible; -webkit-transform: scaleX(1); transform: scaleX(1);
}
}}
<img width="60" height="60" src="https://wiki.taucetistation.org/images/4/49/CommunityFiction.png"> Истории из раундов / Рассказы |
Куда выкладывать моё творчество?
Если у вас возникло желание поделиться с сообществом своими творениями, но вы не знаете, как это сделать, то здесь вы найдёте ответ на данный вопрос: