111 lines
1.8 KiB
CSS
111 lines
1.8 KiB
CSS
@keyframes anim
|
|
{
|
|
0% { margin-left: 0px; transform: rotate(6deg); }
|
|
50% { margin-left: 200px; transform: rotate(0deg); }
|
|
100% { margin-left: 0px; transform: rotate(-5deg); }
|
|
}
|
|
|
|
@keyframes anim2
|
|
{
|
|
0% { color: red; font-size: 20px; }
|
|
25% { color: black; font-size: 20px; }
|
|
50% { color: green; font-size: 21px; }
|
|
75% { color: white; font-size: 30px; }
|
|
100% { color: blue; font-size: 20px; }
|
|
}
|
|
|
|
body
|
|
{
|
|
background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/2/26/Cat_8.jpg/180px-Cat_8.jpg");
|
|
cursor: not-allowed;
|
|
width: 200%;
|
|
transform: skew(3deg);
|
|
}
|
|
|
|
p
|
|
{
|
|
background-color: red;
|
|
font-family: cursive;
|
|
transform: rotate(170deg);
|
|
}
|
|
|
|
h1
|
|
{
|
|
animation-name: anim;
|
|
animation-duration: 1s;
|
|
animation-iteration-count: infinite;
|
|
animation-timing-function: linear;
|
|
cursor: zoom-in;
|
|
color: brown;
|
|
}
|
|
|
|
h2, h3
|
|
{
|
|
animation-name: anim2;
|
|
animation-duration: 0.1s;
|
|
animation-iteration-count: infinite;
|
|
animation-timing-function: linear;
|
|
background-color: yellow;
|
|
cursor: zoom-out;
|
|
}
|
|
|
|
.nav
|
|
{
|
|
display: block;
|
|
transform: perspective(300px);
|
|
transform: rotateY(50deg);
|
|
}
|
|
|
|
pre, code
|
|
{
|
|
font-family: fantasy;
|
|
background-color: rgba(255,255,255,0.7);
|
|
color: green;
|
|
cursor: none;
|
|
}
|
|
|
|
em, i
|
|
{
|
|
animation-name: anim2;
|
|
animation-duration: 2s;
|
|
animation-iteration-count: infinite;
|
|
animation-timing-function: linear;
|
|
}
|
|
|
|
b, strong
|
|
{
|
|
color: #00f;
|
|
font-family: emoji;
|
|
}
|
|
|
|
h1::before, h2::before, h1::after, h2::after
|
|
{
|
|
content: '';
|
|
background: url("https://upload.wikimedia.org/wikipedia/commons/3/36/Anarcho_pacifism_animation_2.gif?20190915203531");
|
|
background-size: cover;
|
|
display: inline-block;
|
|
width: 64px;
|
|
height: 64px;
|
|
}
|
|
|
|
a
|
|
{
|
|
color: #0f0;
|
|
cursor: row-resize;
|
|
}
|
|
|
|
a:hover
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
p:after
|
|
{
|
|
content: "😀😁😂😃";
|
|
}
|
|
|
|
p:before
|
|
{
|
|
content: " 𒐫 𒈙 ﷽";
|
|
}
|