成果展示:
上代码!!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/normalize.css" />
<title>石头剪刀布</title>
<link rel="icon" href="https://haiyong.site/img/favicon.png" sizes="192x192" />
</head>
<body>
<div id="container">
<div style="font-size:30px;text-align:center;height:88px;line-height:88px;background:#662577;color:#ffffff">我是渴望的C++</div>
<h2>石头剪刀布</h2>
<div id="game-container">
<div id="points">
<label for="playerPoints">玩家分数:</label>
<span class="playerPoints"></span>
<label for="computerPoints">电脑分数:</label>
<span class="computerPoints"></span>
</div>
<div id="choice">
<div id="playerChoice">
< img src="" alt="" id="playerChoiceImg">
<h3 id="playerChoiceTxt"></h3>
</div>
<div id="computerChoice">
< img src="" alt="" id="computerChoiceImg">
<h3 id="computerChoiceTxt"></h3>
</div>
</div>
<div id="buttons">
<button class="btn">石头</button>
<button class="btn">布</button>
<button class="btn">剪刀</button>
</div>
</div>
</div>
<footer class="page-footer">
<span>关注我</span>
<a href=" " target="_blank">
< img class="touxiang" src="https://haiyong.site/img/favicon.png">
</a >
</footer>
<footer class="page-left">
<a href="https://code.haiyong.site/" target="_blank">
< img class="touxiang" src="https://code.haiyong.site/wp-content/uploads/2022/10/logo.jpg">
</a >
<span>不迷路</span>
</footer>
<script>
window.onload = function(){
document.onkeydown = function (){
var e = window.event || arguments[0];
//F12
if(e.keyCode == 123){
return false;
//Ctrl+Shift+I
}else if((e.ctrlKey) && (e.shiftKey) && (e.keyCode == 73)){
return false;
//Ctrl+Shift+C
}else if((e.ctrlKey) && (e.shiftKey) && (e.keyCode == 67)){
return false;
//Shift+F10
}else if((e.shiftKey) && (e.keyCode == 121)){
return false;
//Ctrl+U
}else if((e.ctrlKey) && (e.keyCode == 85)){
return false;
//Ctrl+S
}else if((e.ctrlKey) && (e.keyCode == 83)){
return false;
}
};
document.oncontextmenu = function (){
return false;
}
}
document.onselectstart=new Function('event.returnValue=false;');
document.body.onselectstart = function() {
self.event.returnValue=false
};
</script>
<script src="js/script.js"></script>
</body>
</html>
拿走不谢!