Kod permainan web ular
Kod permainan web ular
<gaya>
::pilihan {
warna:#FFFFFF;
latar belakang:lutsinar;
}
::-moz-selection {
warna:#FFFFFF;
latar belakang:lutsinar;
}
* {
jidar:0;
pelapik:0;
font-family:"VT323";
}
badan {
warna latar belakang:#000000;
}
.balut {
margin-left:auto;
margin-right:auto;
}
pengepala {
lebar:340px;
saiz fon:0;
}
kanvas {
paparan:tiada;
gaya sempadan:pejal;
lebar sempadan:10px;
warna sempadan:#FFFFFF;
}
kanvas:fokus {
garis besar:tiada;
}
/* Gaya Teratas */
h1 {
paparan:inline-block;
lebar:100px;
saiz fon:32px;
warna:#FFFFFF;
}
.skor {
paparan:inline-block;
lebar:240px;
saiz fon: 20px;
warna:#FFFFFF;
text-align:right;
}
.nilai_skor {
font-size:inherit;
}
/* Semua gaya skrin */
#gameover a,#setting a,#menu a {
paparan:blok;
}
#gameover a,#setting a:hover,#menu a:hover {
kursor:penunjuk;
}
#gameover a:hover::before,#setting a:hover::before,#menu a:hover::before {
kandungan:">";
jidar-kanan:10px;
}
/* Gaya Skrin Menu */
#menu {
paparan:blok;
lebar:340px;
padding-top:95px;
padding-bottom:95px;
saiz fon:40px;
margin-left:auto;
margin-right:auto;
text-align:center;
warna:#FFF;
}
#menu h2 {
-webkit-animasi:logo-ani 1000ms linear tak terhingga;
animasi:logo-ani 1000ms linear tak terhingga;
jidar bawah:30px;
}
#menu a {
saiz fon:30px;
}
@-webkit-keyframes logo-ani {
50% {
-webkit-transform:scale(1.3,1.3);
}
100% {
-webkit-transform:scale(1.0,1.0);
}
}@keyframes logo-ani {
50% {
transform:scale(1.3,1.3);
}
100% {
transform:scale(1.0,1.0);
}
}/* Gaya Permainan Atas Skrin */
#gameover {
paparan:tiada;
lebar:340px;
padding-top:95px;
padding-bottom:95px;
margin-left:auto;
margin-right:auto;
text-align:center;
saiz fon:30px;
warna:#FFF;
}
#gameover p {
jidar atas:25px;
saiz fon: 20px;
}
/* Tetapan Gaya Skrin */
#setting {
paparan:tiada;
lebar:340px;
margin-left:auto;
margin-right:auto;
padding-top:85px;
padding-bottom:85px;
saiz fon:30px;
warna:#FFF;
text-align:center;
}
#setting h2 {
jidar bawah:15px;
}
#setting p {
jidar atas:10px;
}
#menetapkan input {
paparan:tiada;
}
#setting label {
kursor:penunjuk;
}
#setting input:ditanda + label {
warna latar belakang:#FFF;
warna:#000;
}
</style>
</head>
<body><script src="/demos/googlegg.js"></script>
<header class="wrap">
<h1>Ular</h1>
<p class="skor">Skor: <span id="score_value">0</span></p>
</header>
<canvas class="wrap" id="snake" width="320" height="320" tabindex="1"></canvas>
<!-- Permainan Di Atas Skrin -->
<div id="gameover">
<h2>Game Over</h2>
<p>tekan <span style="background-color: #FFFFFF; color: #000000">space</span> untuk memulakan</p>
<a id="newgame_gameover">permainan baharu</a>
<a id="setting_gameover">settings</a>
</div>
<!-- Skrin tetapan -->
<div id="setting">
<h2>Tetapan</h2>
<a id="newgame_setting">permainan baharu</a>
<p>Kelajuan:
<input id="speed1" type="radio" name="speed" value="120" ditanda/>
<label untuk="kelajuan1">Perlahan</label>
<input id="speed2" type="radio" name="speed" value="75" />
<label untuk="kelajuan2">Biasa</label>
<input id="speed3" type="radio" name="speed" value="35" />
<label untuk="kelajuan3">Pantas</label>
</p>
贪吃蛇网页小游戏代码是一款简单黑白风格好玩的在线网页小游戏特效。
Semua sumber di laman web ini disumbangkan oleh netizen atau dicetak semula oleh tapak muat turun utama. Sila semak integriti perisian itu sendiri! Semua sumber di laman web ini adalah untuk rujukan pembelajaran sahaja. Tolong jangan gunakannya untuk tujuan komersial. Jika tidak, anda akan bertanggungjawab untuk semua akibat! Jika terdapat sebarang pelanggaran, sila hubungi kami untuk memadamkannya. Maklumat hubungan: admin@php.cn
Artikel Berkaitan
![Lima kod kesan khas dinamik Tahun 2022 Harimau yang hebat [Disyorkan]](https://img.php.cn/upload/article/000/000/024/61ef5d41bfe71620.png)
Lima kod kesan khas dinamik Tahun 2022 Harimau yang hebat [Disyorkan]
25 Jan 2022
Sambut Tahun Baru dengan gembira! Tahun Baru 2022 semakin hampir Tahun ini adalah Tahun Harimau di Renyin. Terdapat aliran produk yang tidak berkesudahan dengan pelbagai imej harimau. Laman web PHP Cina berikut meringkaskan dan mengesyorkan kod kesan khas terkini untuk Tahun Harimau, termasuk kod kesan khas untuk menghantar berkat untuk Tahun Harimau, melukis animasi untuk Tahun Harimau dan kod kesan khas yang lain.
Bagaimanakah Saya Boleh Mengawal Pertumbuhan Ular dan Pergerakan Badan Dirantai dalam Permainan Ular?
06 Dec 2024
Cara Mengawal Pertumbuhan Ular dan Pergerakan Badan DirantaiDalam permainan ular, pergerakan ular ditentukan oleh kedudukan kepalanya, dan badan...
Bagaimana Saya Boleh Membuat Badan Permainan Ular Ikut Kepalanya?
29 Dec 2024
Bagaimanakah saya boleh mencapai bahagian badan ular mengikut kepala ular pada laluannya, apabila kepala ular bergerak ke hadapan? Pelaksanaan ular...
![Bahan tapak web kod kesan khas apresiasi bulan Festival Pertengahan Musim Luruh 2022 [muat turun percuma]](https://img.php.cn/upload/article/000/000/024/631ab2b40683f955.jpg)
Bahan tapak web kod kesan khas apresiasi bulan Festival Pertengahan Musim Luruh 2022 [muat turun percuma]
09 Sep 2022
Perayaan Pertengahan Musim Luruh tahunan semakin hampir, dan sudah tiba masanya untuk menikmati bulan purnama bersama seisi keluarga! Di bawah, laman web PHP Cina telah menyediakan 5 kod sumber kesan khas Apresiasi Bulan Musim Luruh Pertengahan dan 12 bahan gambar vektor yang mengandungi elemen Arnab Bulan Pertengahan Musim Luruh untuk dikongsi dengan anda!
Bagaimana untuk Menghidupkan Pergerakan Ular dan Menambah Panjangnya dalam Permainan?
03 Dec 2024
Cara Menghidupkan Pergerakan Ular dan Menambah Panjang UlarSenario: Anda sedang membangunkan permainan ular di mana ular itu melintasi padang permainan. setelah...
Bagaimanakah Saya Melaksanakan Pertumbuhan dan Pergerakan Badan Ular dalam Permainan Video?
11 Dec 2024
Bagaimana Saya Boleh Memanjangkan Ular dan Menyambung Komponen Badannya Semasa Pergerakan? Apabila melaksanakan permainan video ular, anda mahu badannya memanjang...
Mari kita bincangkan tentang cara menggunakan uniapp untuk membangunkan permainan ular!
20 May 2022
Bagaimana untuk menggunakan uniapp untuk membangunkan permainan ular? Artikel berikut akan membimbing anda langkah demi langkah dalam melaksanakan permainan Snake dalam uniapp. Saya harap ia akan membantu anda!
Koleksi 16 kod kesan khas Krismas yang indah dan praktikal!
21 Dec 2021
Krismas akan datang, dan kami pengaturcara juga harus berasa romantis~ Laman web PHP Cina akan berkongsi dengan anda semua jenis kod kesan khas Krismas yang indah dan praktikal, termasuk pelbagai bahan kesan khas pokok Krismas dan kesan khas bahan animasi Santa Claus Seterusnya. dsb., klik pada pautan yang sepadan dalam artikel untuk pratonton dalam talian dan muat turun secara percuma!
Apakah maksud kelas pseudo dan objek pseudo dalam css
27 Apr 2022
Dalam CSS, pseudo-class bermaksud untuk mentakrifkan keadaan khas elemen Anda boleh menambah beberapa kesan khas pemilih Mereka adalah beberapa ciri dan fungsi yang diberikan oleh kelas terbina dalam CSS itu sendiri adalah untuk menambah kesan khas kepada tertentu pemilih. Maksudnya, kesannya boleh dicapai dengan menambah elemen sebenar.
Hot Tools
jQuery+Html5 merealisasikan kod animasi pengakuan yang indah
jQuery+Html5 melaksanakan kod animasi pengakuan yang indah, kesan animasi yang hebat, yang mesti dimiliki oleh pengaturcara untuk mengaku!
Kod kesan khas js pengakuan romantik pasangan
Kod kesan khas JS untuk pengakuan romantis pasangan Kesan khas tersebut boleh digunakan pada laman web fotografi perkahwinan atau diletakkan di laman web peribadi Ia juga merupakan kesan khas yang disyorkan untuk dimuat turun.
Artifak pengakuan cinta js mudah
Artifak pengakuan cinta js asli yang mudah
Kesan ekspresif animasi zarah html5 Bunker
Kod kesan khas ungkapan animasi zarah html5 Bunker, teks kesan khas animasi boleh ditukar dalam kod, anda boleh membuat halaman di mana anda boleh menyesuaikan input teks, ia sepatutnya sangat popular, kesan khas HTML5 ini sangat cantik.
templat antara muka log masuk latar belakang responsif jQuery
jQuery responsif log masuk templat kod sumber html Halaman log masuk menggunakan jquery untuk mengesahkan borang dan menentukan sama ada nama pengguna dan kata laluan memenuhi keperluan Biasanya halaman log masuk adalah halaman yang mesti digunakan pada laman web korporat atau laman web pusat membeli-belah halaman, Apabila pelayar mengezum masuk atau keluar, latar belakang akan mengubah saiz imej mengikut pelayar! Laman web PHP Cina mengesyorkan muat turun!