Praktyczne przykłady: Angry Birds

A na deser taka oto perełka - wszystko oczywiście od początku do końca stworzone za pomocą kodu, bez użycia jakiegokolwiek pliku graficznego!
<polygon points="381,193.67 332,200.67 324,202.67 298,216.67 278,229.67 247,253.67 225,274.67 210,290 193,308 171,336.67 152,366.67 131,405.33 114,447.33 103,486 95,523.33 92,546.33 92,575.33 95,607 98,629 102,650 109,665 115,680 121,693 128,706 142,723 154,737 163,746 176,756.67 193,769.67 207,779.67 234,795.67 254.67,805.67 272.67,813.67 301.67,824.67 315.67,829.67 341.67,836.67 369.67,842.67 399.67,847.67 437.67,851.67 467.67,852.67 492.67,851.67 522.67,849.67 549.67,845.67 568.33,841.67 589.33,836.67 610.33,830.67 634.33,821.67 652.33,813.67 672.33,803.67 691.33,791.67 701.33,781.67 707.33,778.67 720.33,769.67 737.33,752.67 751.33,737 767.33,715 775.33,701 783.33,685 789.33,669 796.33,648.67 802.33,623.67 807.33,600 810.33,577 810.33,555 810.33,524.33 808.33,501.33 804.33,475.33 795.33,444.33 789.33,425.33 778.33,399.33 761.33,369.33 750.33,351.33 735.33,331.33 718.33,311.33 704.33,295.33 689.33,280.33 676.33,268.33 661.33,256.33 636.33,238.67 615.33,225.67 598.33,216.67 591.33,211.67 583.33,201.67 576.33,184 566.33,163 554.33,146 541.33,128 527.33,113 508.33,94 490.33,78 469.33,64 451.33,55 433.33,47 417.33,42 400.33,43 389.33,45 383.33,47 376.33,52 370.33,59 363.33,71 361.33,80 363.33,90 371.33,103 377.33,112 384.33,119 393.33,127 409.33,136 485.33,180 473.33,178 451.33,173 437.33,168 427.33,164 419.33,160 404.33,150 368.33,124 364.33,121 355.33,119 342.33,118 321.33,115 300.33,114 280.33,116 261.33,120 248.33,125 242.33,131 236.33,137 231.33,145 227.33,154 230.33,165 238.33,174 250.33,180 265.33,185 287.33,189 306.33,191 322.33,192 355.33,192 379.33,192 384.33,193 " style="fill: #ff0033; stroke: black; stroke-width: 12;" /> <polygon points="207,779.67 234,795.67 254.67,805.67 272.67,813.67 301.67,824.67 315.67,829.67 341.67,836.67 369.67,842.67 399.67,847.67 437.67,851.67 467.67,852.67 492.67,851.67 522.67,849.67 549.67,845.67 568.33,841.67 589.33,836.67 610.33,830.67 634.33,821.67 652.33,813.67 672.33,803.67 691.33,791.67 701.33,781.67 692.4,760.4 680.4,738.4 668.4,724.4 658.4,711.4 644.4,698.4 628.4,685.4 608.4,672.4 594.4,665.4 586.4,662.4 353.4,656.4 327.8,657.4 322.8,657.4 309.8,664.4 296.8,670.4 280.8,679.4 265.8,689.4 250.8,700.4 236.8,713.4 223.8,728.4 214.8,740.4 206.8,754.4 198.8,774.4" style="fill: #ffcc99; stroke-width: 0;" /> <polyline points="381,193.67 332,200.67 324,202.67 298,216.67 278,229.67 247,253.67 225,274.67 210,290 193,308 171,336.67 152,366.67 131,405.33 114,447.33 103,486 95,523.33 92,546.33 92,575.33 95,607 98,629 102,650 109,665 115,680 121,693 128,706 142,723 154,737 163,746 176,756.67 193,769.67 207,779.67 234,795.67 254.67,805.67 272.67,813.67 301.67,824.67 315.67,829.67 341.67,836.67 369.67,842.67 399.67,847.67 437.67,851.67 467.67,852.67 492.67,851.67 522.67,849.67 549.67,845.67 568.33,841.67 589.33,836.67 610.33,830.67 634.33,821.67 652.33,813.67 672.33,803.67 691.33,791.67 701.33,781.67 707.33,778.67 720.33,769.67 737.33,752.67 751.33,737 767.33,715 775.33,701 783.33,685 789.33,669 796.33,648.67 802.33,623.67 807.33,600 810.33,577 810.33,555 810.33,524.33 808.33,501.33 804.33,475.33 795.33,444.33 789.33,425.33 778.33,399.33 761.33,369.33 750.33,351.33 735.33,331.33 718.33,311.33 704.33,295.33 689.33,280.33 676.33,268.33 661.33,256.33 636.33,238.67 615.33,225.67 598.33,216.67 591.33,211.67 583.33,201.67 576.33,184 566.33,163 554.33,146 541.33,128 527.33,113 508.33,94 490.33,78 469.33,64 451.33,55 433.33,47 417.33,42 400.33,43 389.33,45 383.33,47 376.33,52 370.33,59 363.33,71 361.33,80 363.33,90 371.33,103 377.33,112 384.33,119 393.33,127 409.33,136 485.33,180 473.33,178 451.33,173 437.33,168 427.33,164 419.33,160 404.33,150 368.33,124 364.33,121 355.33,119 342.33,118 321.33,115 300.33,114 280.33,116 261.33,120 248.33,125 242.33,131 236.33,137 231.33,145 227.33,154 230.33,165 238.33,174 250.33,180 265.33,185 287.33,189 306.33,191 322.33,192 355.33,192 379.33,192 384.33,193 " style="fill: none; stroke: black; stroke-width: 12;" /> <polygon points="353,611.6 336,606.6 322,599.6 310,589.6 299,576.6 293,564.6 287,545.6 285,534.6 287,521.6 290,506.6 294,489.6 298,483.6 298,479.6 249,465.6 249,437.6 254,412.6 263,392.6 267,391.6 278,394.6 450,467.6 458,469.6 464,467.6 598,411.6 651.8,391.6 655.8,395.6 661.8,412.6 665.8,428.6 670.8,463.6 664.8,466.6 653.8,470.6 639.8,474.6 618.8,481.6 608.8,483.6 613.8,494.6 619.8,507.6 623.8,526.6 622.8,546.6 617.8,565.6 612.8,577.6 602.8,592.6 590.8,602.6 582.8,608.6 561.8,616.6" style="fill: black; stroke: black; stroke-width: 2;" /> <polygon points="373,595.6 359,595.6 348,592.6 339,590.6 327,584.6 315,573.6 302,555.6 297,536.6 297,519.6 299,512.6 301,500.6 306,489.6 311,482.6 390,502.6 384,509.6 379,514.6 377,518.6 381,521.6 380,526.6 375,529.6 376,535.6 380,544.6 387,550.6 394,553.6 402,554.6 412,551.6 419,545.6 424,537.6 426,528.6 424,520.6 420,510.6 450,516.6 453,523.6 452,531.6 451,541.6 449,549.6 440,552.6 425,560.6 412,567.6 404,574.6 388,584.6 " style="fill: white; stroke-width: 0;" /> <polygon points="468.4,550.6 476.4,553.6 488.4,559.6 495.4,563.6 507.4,571.6 518.4,579.6 528.4,586.6 533.4,590.6 541.4,599.6 546.4,604.6 564.4,599.6 581.4,593.6 590.4,586.6 598.4,578.6 606.4,567.6 611.4,555.6 613.4,539.6 612.4,526.6 611.4,511.6 606.4,497.6 598.4,483.6 518.4,504.6 518.4,508.6 523.4,513.6 527.4,520.6 529.4,527.6 529.4,534.6 526.4,540.6 521.4,545.6 514.4,548.6 506.4,549.6 498.4,545.6 493.4,541.6 489.4,537.6 487.4,533.6 492.4,531.6 494.4,525.6 492.4,521.6 489.4,519.6 490.4,511.6 464.4,518.6 464.4,525.6 463.4,533.6 464.4,540.6 " style="fill: white; stroke-width: 0;" /> <polygon points="352,675.4 357,691.4 368,711.4 378,727.4 392,740.4 409,755.4 434,771.4 455,783.4 462,783.4 503,755.4 527,734.4 543,712.4 557,687.4 558,680.4 468,630.4 " style="fill: orange; stroke-width: 20; stroke: black;" /> <polygon points="450,700.4 409,691.4 384,684.4 364,680.4 348,672.4 336,666.4 340,646.4 358,621.4 378,602.4 396,585.4 429,564.4 446,556.4 454,552.4 476,559.4 504,574.4 521,587.4 542,606.4 559,625.4 568,640.4 574,653.4 578,668.4 578,674.4 564,680.4 542,687.4 517,692.4 489,696.4 473,700.4 463,702.4 " style="fill: #ffcc33; stroke-width: 15; stroke: black;" />

Chcesz dać mi znać że podoba Ci się treść strony i rozwijanie jej ma sens? Polub nas na FB!