SaveText.Ru

Бета Игра
  1. HTML5
  2.  
  3.  
  4. <!DOCTYPE HTML>
  5. <html>
  6. <head>
  7. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  8. <title>Фоновая музыка на HTML5-StepkinBlog.ru</title>
  9. </head>
  10. <body> <!--grab-->
  11.  
  12. <h1 class="name_class">Game Surviv Pixl</h1>
  13. <b class="obnov_class">Версия игры: v:1.2.5</b>
  14. <button class="button_play">Play</button>
  15. <button class="button_multip">Multeplaer</button>
  16. <div class="chat_button">Chat</div>
  17. <button class="adminP_class_button">+A</button>
  18.  <input class="input" type="text" placeholder="Напишите ваше сообщение в чат:"
  19. </body>
  20. </html>
  21.  
  22.  
  23.  
  24.  
  25.  
  26. body {
  27.    
  28. background-image: url('https://thumbs.gfycat.com/FreePlumpDugong-size_restricted.gif');
  29. background-size: cover;
  30. cursor: crosshair;
  31.    
  32. }
  33.  
  34. .name_class {
  35. color: red;
  36. background-image: url('https://im0-tub-ua.yandex.net/i?id=010a90e3a4033375d36da97a4369602c&n=13');
  37. width: 1200;
  38. height: 290px;
  39. font-family: Trebuchet MS;
  40. font-size: 150;
  41. border-radius: 150px;
  42. border: 3px solid blue;
  43. position: absolute;
  44. left: 5;
  45. top: -34;
  46. }
  47.  
  48. .name_class:hover {
  49. color: lime;
  50. cursor: default;
  51. }
  52.  
  53. .obnov_class {
  54. color: yellow;
  55. position: absolute;
  56. left: 1050;
  57.    
  58.    
  59. }
  60.  
  61. .button_play {
  62. color: blue;
  63. font-family: Comic Sans MS;
  64. position: absolute;
  65. left: 555px;
  66. top: 400px;
  67. background: lime;
  68. border: 3px solid black;
  69. width: 250;
  70. height: 50;
  71. font-size: 35;
  72. }
  73.  
  74. .button_play:hover {
  75. color: red;
  76. }
  77.  
  78. .button_play:active {
  79. color: lime;
  80. background: violet;
  81. }
  82.  
  83. .button_multip {
  84. color: blue;
  85. font-family: Comic Sans MS;
  86. position: absolute;
  87. left: 555;
  88. top: 480;
  89. background: lime;
  90. border: 3px solid black;
  91. width: 250;
  92. height: 50;
  93. font-size: 35;
  94. }
  95.  
  96. .button_multip:hover {
  97. color: red;
  98. }
  99.  
  100. .button_multip:active {
  101. color: lime;
  102. background: violet;
  103. }
  104.  
  105. .chat_button {
  106. color: blue;
  107. background: lime;
  108. position: absolute;
  109. top: 800;
  110. left: 1100;
  111. border: 2px solid violet;
  112. font-size: 20;
  113. font-family: Comic Sans MS;
  114. border-radius: 150px;
  115. }
  116.  
  117. .chat_button:active {
  118. width: 400;
  119. height: 400px;
  120. background-image: url('https://prodvijenie-saijtov.ru/gif/gif371.gif');
  121. top: 400;  
  122. position: absolute;
  123.     left: 750;
  124.     border-radius: 0px;
  125. }
  126.  
  127. .input {
  128.    
  129.     position: absolute;
  130.     left: 770;
  131.     top: 760;
  132.     width: 300;
  133.     height: 30;
  134.     background-image: url('https://avatars.mds.yandex.net/get-zen_doc/1112142/pub_5b187eb28c8be3f81e7f2ad7_5b1880a80422b4bb4387d666/orig');
  135. border: 2px solid green;
  136.    
  137. }
  138.  
  139.  
  140.  
  141.  
  142.  
  143.  
  144.  

Share with your friends:

Print