html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<body>
<link href="https://fonts.googleapis.com/css?family=Lora" rel="stylesheet">
<div id="id"> <svg width="400" height="200">
<svg width="400" height="410">
<line x1="8" y1="45" x2="350" y2="45"
style="stroke:brown; stroke-linecap:triangular;
stroke-width:5" />
<rect width="50" height="50"
x="20" y="20" fill="white" />
<circle cx="97" cy="45" r="26" fill="pink" />
<ellipse cx="140" cy="45" rx="16" ry="25" style="fill:green" />
<polyline style="stroke-linejoin:miter; stroke:yellow;
stroke-width:14; fill: none;"
points="160 15, 190 90, 190 15, 220 90, 220 15" />
<circle cx="255" cy="45" r="26" fill="pink" />
<ellipse cx="350" cy="45" rx="16" ry="25" style="fill:green" />
<rect width="50" height="50"
x="283" y="20" fill="white" />
</div>
<strong><big>
Paneer tikka is an Indian dish made from chunks of paneer marinated in spices and grilled in a tandoor.It is a vegetarian alternative to chicken tikka and other meat dishes.It is a popular dish that is widely available in India and countries with an Indian diaspora.</big></strong>
</svg>
</svg>
</body>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
body{
float: left;
width: 300px;
height: 525px;
margin: 4px;
color: #FFF;
background: linear-gradient( Blue, Brown);
font-family:"Lora";
}
#id{
padding:8px;
border:1px black ;
animation-name: rotate ;
animation-duration: 7s;
animation-iteration-count: 2;
-webkit-animation-name: rotate;
-webkit-animation-duration: 7s;
-webkit-animation-iteration-count: 2;
}
@keyframes rotate {
0% { transform:rotate(0deg); }
50% {transform:rotate(180deg);}
100% {transform:rotate( -180deg);}
}
@-webkit-keyframes rotate {
0% {transform:rotate(0degrees);}
50% {transform:rotate(180degrees);}
100%{transform:rotate(-180degrees);}
Enter to Rename, Shift+Enter to Preview
js
js
1
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run