用html写的我的世界


我的世界

/* 我的世界颜色:

按钮:(116,116,116),

物品:(140,140,140),

背景:(200,200,200),

852480 => 40040

*/

/* 字体 */

@font-face{

font-family: kt; /楷体/

src:url(“./fonts/kt.ttf”);

}

@font-face{

font-family: st; /宋体/

src:url(“./fonts/st.ttf”);

}

@font-face{

font-family: xs; /QQ/

src:url(“./fonts/qq2.ttf”);

}

@font-face{

font-family: zyyt; /资源圆体/

src:url(“./fonts/zyyt.woff2”);

}

/*@font-face{

font-family:hwxk; /华文楷体//*

src:url(“./fonts/hwxk.ttf”);

}

@font-face{

font-family:fzybxskt; /方正硬笔行书楷体//*

src:url(“./fonts/fzybxskt.ttf”);

}

@font-face{

font-family:fzqtjt; /方正启体简体//*

src:url(“./fonts/fzqtjt.ttf”);

}

@font-face{

font-family:qq1; /QQ//*

src:url(“./fonts/qq1.ttf”);

}

@font-face{

font-family:qq2; /QQ//*

src:url(“./fonts/qq2.ttf”);

}

@font-face{

font-family:huawei; /HUAWEI//*

src:url(“./fonts/huawei.ttf”);

}*/

*{

font-family: zyyt, serif;

}

h1, h1 *{

font-family: kt, serif;

}

header{

font-family: st, serif;

}

button{

font-family: xs, serif;

font-weight: bold;

}

/* 选择 */

::selection {

color: #fff;

background: #f9cc9d;

}

*{

/* 禁止复制选中 */

-webkit-touch-callout: none; /* iOS Safari */

-webkit-user-select: none; /* Chrome/Safari/Opera */

-khtml-user-select: none; /* Konqueror */

-moz-user-select: none; /* Firefox */

-ms-user-select: none; /* Internet Explorer/Edge */

user-select: none; /* Non-prefixed version, currently not supported by any browser */

/* 无点击线 */

outline: none;

}

/* dat.gui */

.cr.function > div > span.property-name{

width: 100%;

}

.dg.ac{

z-index: 1 !important;

}

body{

margin: 0;

overflow: hidden;

/* 隐藏body窗口区域滚动条 */

}

h1{

position: absolute;

top: 0;

width: 100%;

height: 100%;

margin: 0;

text-align: center;

color: #fff;

background-color: #000;

background-image: radial-gradient(#666, #232, #011);

text-shadow:

0 0 10px rgba(255,0,0, .4),

0 0 20px rgba(0,0,255, .5),

0 0 30px rgba(255,255,0, .7),

0 0 10px rgba(255,0,0, .4),

0 0 20px rgba(0,0,255, .5),

0 0 30px rgba(255,255,0, .7),

0 0 10px rgba(255,0,0, .4),

0 0 20px rgba(0,0,255, .5),

0 0 30px rgba(255,255,0, .7);

}

/* h1::before{

/* content: “\a\a”;

white-space: pre; //

display: block;

height: 6.6vmax;

} */

h1::after{

content: “Copyright © 2020 by wzh”;

white-space: pre;

font-size: 2vmin;

position: absolute;

bottom: 6vh;

left: 50%;

transform: translateX(-50%);

text-shadow: 0.5px 0px 0px #aaa, //

-0.5px 0px 0px #ddd, //

0px 0.5px 0px #ddd, //

0px -0.5px 0px #aaa; //

}

/* 进度条 */

#progress{

font-size: 3vmax;

padding-top: 6.6vmax;

/* animation-name: backgroundColor;

animation-duration: 1s;

animation-iteration-count: infinite; */

background-image: url(./img/loading.png);

}

/* @keyframes backgroundColor{

0%{

background-image: radial-gradient(#333, #112, #011);

}

25%{

background-image: radial-gradient(#555, #223, #122);

}

50%{

background-image: radial-gradient(#666, #334, #233);

}

75%{

background-image: radial-gradient(#888, #445, #344);

}

100%{

background-image: radial-gradient(#999, #556, #455);

}

} */

#progress > progress{

background-color: red;

width: 63vw;

}

#progress > progress::-webkit-progress-bar{

background-color: gray;

background-image: linear-gradient(45deg, black, gray, #aaa);

}

#progress > progress::-webkit-progress-value{

background-color: green;

background-image: repeating-linear-gradient(

135deg,

red 0vw,

orange 9vw,

yellow 18vw,

green 27vw,

blue 36vw,

indigo 45vw,

purple 54vw

);

}

/* 遮罩 */

#help{

opacity: 0.5;

font-size: 3vmax;

padding-top: 6.6vmax;

}

/* 指针 */

#pointer{

position: absolute;

width: 3.75vmax;

height: 3.75vmax;

left: 50%;

top: 50%;

transform: translate(-50%,-50%);

cursor: none;

}

#pointer > div{

position: absolute;

background-color: rgba(255, 255, 255, 0.666666);

left: 50%;

top: 50%;

transform: translate(-50%,-50%);

}

#pointer > div:first-child{

width: 0.25vmax;

height: 3.75vmax;

}

#pointer > div:last-child{

width: 3.75vmax;

height: 0.25vmax;

}

/* 横竖屏提示 */

@media not screen and (orientation:portrait){ /* 电脑 */

#warning{

display: none;

}

}

#warning{

font-size: 6.6vmax;

padding-top: 12.6vmax;

}

#warning > button{

width: 80%;

/* height: 60px; */

position: relative;

top: 3.6vmax;

font-size: 6vmax;

}

/* 死亡 */

#die{

background-image: none;

background-color: rgba(200,0,0,0.392157);

font-size: 3.6vmax;

padding-top: 3.6vmax;

}

#die p{

font-size: 0.36em;

margin: 0;

}

#die > header{

font-size: 5.6vmax;

}

#die > button{

width: 50%;

font-size: 6vmax;

/font-family: hwxk, serif;/

}

/*#die > .resaon{

font-family: zyyt, serif;

}*/

/* 信息框 */

dialog{

position: absolute;

top: 16vmax;

max-width: 50vw;

border-radius: 1vmax;

z-index: 5;

}

/* 摇杆操纵 */

#control{

position: absolute;

bottom: 16%;

left: 10%;

background: #aaa;

opacity: 0.66;

width: 66px;

height: 66px;

border-radius: 50%;

}

#jump{

position: absolute;

bottom: 16%;

right: 10%;

background: #aaa;

opacity: 0.66;

width: 46px;

height: 46px;

border-radius: 50%;

}

/* 物品栏 */

#tools{

position: absolute;

bottom: -2px;

left: 50%;

transform: translateX(-50%);

/*width: 36vw;

height: 6vw;*/

}

#tools > img{

width: 6vw;

height: 6vw;

display: inline-block;

margin: 0 -2px;

border: 3px groove #aaa;

}

textarea{

resize: none;

}

/* 窗口 */

#bag, #command{

width: 80vw;

/* height: 80vh; */

position: absolute;

left: 50%;

top: 50%;

transform: translate(-50%, -50%);

display: none;

z-index: 1;

background-color: rgb(200,200,200);

border: 3px #fff outset;

padding: 1.6%;

}

/*#command{

width: 86.66%;

height: 86.66%;

}*/

/* 命令方块 */

#command > textarea{

width: 100%;

height: 70vh;

color: black;

background-color: #d6d6d6;

border: 2px #fff inset;

font-size: 3vmax;

}

#command > span{

font-size: 66%;

}

#command > button{

width: 48%;

height: 9%;

margin: 0 0.6%;

font-size: 3vmax;

}

/* 背包 */

#bag{ /* 反向 */

flex-direction: column-reverse;

overflow-y: auto;

top: 45%;

/* height: 75vh; */

padding: 0;

}

#bag > input[type=“radio”][name=“bag-nav”]{ /* 隐藏input */

display: none;

}

#bag > input[type=“radio”][name=“bag-nav”] + div{ /* 未选择的隐藏 */

display: none;

}

#bag > input[type=“radio”][name=“bag-nav”]:checked + div{ /* 选择的显示 */

display: flex;

}

/*#bag > input[type=“radio”][name=“bag-nav”]:nth-of-type(1):checked + div{

display: flex;

}*/

#bag > nav{

display: flex;

display: -webkit-flex; /* Safari */

justify-content: center;

width: 100%;

}

#bag > nav > label{

width: 33%;

height: 4vmax;

color: rgb(200,200,200);

background-color: rgb(116,116,116);

border: 3px outset rgb(200,200,200);

text-align: center;

font-size: 3vmax;

line-height: 4.6vmax;

}

#bag > nav > label[onclick]{

width: 10%;

border-radius: 666px;

}

#bag > nav > label[onclick]:hover{

color: black;

background-color: rgb(200,200,200);

border: 3px outset rgb(116,116,116);

}

#bag > input:nth-of-type(1)[type=“radio”][name=“bag-nav”]#bag-nav-choice1:checked ~ nav > label:nth-of-type(1),

#bag > input:nth-of-type(2)[type=“radio”][name=“bag-nav”]#bag-nav-choice2:checked ~ nav > label:nth-of-type(2),

#bag > input:nth-of-type(3)[type=“radio”][name=“bag-nav”]#bag-nav-choice3:checked ~ nav > label:nth-of-type(3){

color: black;

background-color: rgb(200,200,200);

border: 3px outset rgb(116,116,116);

}

#bag > div{

height: 100%;

}

#bag > div:nth-of-type(1) > #bag_deskgood{

margin: 1vw;

border: 3px inset rgb(200,200,200);

}

#bag > div:nth-of-type(1) > ul{

display: inline-flex;

flex-direction: column;

justify-content: space-around;

margin: 1vw;

padding: 0;

}

#bag > div:nth-of-type(1) > ul > li{

display: block;

font-size: 3vmax;

}

#bag > div:nth-of-type(1) > ul > li > ol{

display: inline-flex;

margin: 0;

padding: 0;

}

#bag > div:nth-of-type(1) > ul > li > ol > li{

display: block;

width: 6vmax;

height: 6vmax;

border: 2px inset rgb(116,116,116);

}

#bag > div:nth-of-type(1) > ul > li > ol > li > img{

width: 100%;

height: 100%;

}

if (typeof(require) != “undefined”)

window.$ = window.jQuery = require(“./js/modules/jquery.min.js”);

转存失败
重新上传
取消

deskgood.goY(10000*100);

deskgood.move(0,10000*100,0);

deskgood.moveTo(0,10000*100);

//这是注释,告诉你这三个命令都可以把deskgood送上万米高空

运行代码即表示同意《免责协议》:输入代码产生的一切后果由玩家自行承担

关闭

运行

“状态”功能待开发中……

“制造”功能待开发中……

物品

状态

智造

关闭

WSAD/↑↓←→: 前后左右; 空格:跳跃; 连按W/ctrl+W:疾跑;

Esc: 退出锁定鼠标并保存游戏; F2: 截图;

Pause-Break: 暂停切换; F10: 打开/关闭dat.gui;

请先点击任意处锁定鼠标以开始游戏

贴图加载中……

进度:

0%

生命诚可贵,生命只有一次,请珍爱生命

推荐使用横屏运行(启用浏览器横屏或下载apk(完整版)or(简化版))

继续竖屏

游戏结束!

GAME OVER

角色deskgood死亡(正在播放:凉凉)

死因:未知

注:生命诚可贵,生命只有一次,请珍爱生命,deskgood无法重生,游戏即将关闭

结束

OVER

你的浏览器不支持JavaScript,无法运行!
//退出

function exit(){

window.open(“home.html”, “_self”).close();

try{

plus.runtime.quit();

}catch(e){}

}

//运行命令方块

function run(code){

try{

eval(code);

}catch(err){

console.error(“【命令】\n代码运行出错,错误信息(自行翻译):\n”+err);

alert(“代码运行出错,错误信息(自行翻译,可在VConsole查看):\n”+err);

/* $.get(“http://fanyi.youdao.com/translate”,{

doctype: “json”,

type: “auto”,

i: err

},function(data, state, xhr){

console.log(data);

try{

if (state == “success” & !!data.translateResult[0][0].tgt){

console.error(“【命令方块】\n代码运行出错,错误信息:\n”+err+“\n译文(有道翻译提供):”+data.translateResult[0][0].tgt);

alert(“代码运行出错,错误信息(可在VConsole查看):\n”+err+“\n译文(有道翻译提供):”+data.translateResult[0][0].tgt);

}else{

console.error(“【命令方块】\n代码运行出错,错误信息(自行翻译):\n”+err);

alert(“代码运行出错,错误信息(自行翻译,可在VConsole查看):\n”+err);

}

}catch(e){

console.error(“【命令方块】\n代码运行出错,错误信息(自行翻译):\n”+err);

alert(“代码运行出错,错误信息(自行翻译,可在VConsole查看):\n”+err);

}

}); */

}

}

var stop = true,

device, //设备:true手机,false电脑

perload_condition = 0,

TimeSpeed = 1;

function get_date(){ //获取时间

return new Date( (+new Date)*TimeSpeed );

//return new Date();

}

/**

  • 判断手机电脑

*/

if (/ipad|iphone|midp|rv:1.2.3.4|ucweb|android|windows ce|windows mobile/.test(

navigator.userAgent.toLowerCase()

)

){ //手机

device = true;

let control = document.createElement(“div”);

let jump = document.createElement(“div”);

control.id = “control”;

jump.id = “jump”;

document.body.appendChild(control);

document.body.appendChild(jump);

stop = false;

/*let vconsole = document.createElement(“script”);

vconsole.src = “https://cdn.bootcss.com/vConsole/3.3.4/vconsole.min.js”;

vconsole.onload = function(){

new VConsole();

document.getElementById(“__vconsole”).childNodes[1].style.opacity = 0.5;

document.getElementById(“__vconsole”).childNodes[1].style.borderRadius = “66px”;

};

document.body.appendChild(vconsole);*/

//new VConsole();

}else{ //电脑

device = false;

/* 遮罩,指针 */

$(“#help, #pointer”).css(“display”, “block”);

//请求指针锁定

document.body.requestPointerLock =

document.body.requestPointerLock ||

document.body.mozRequestPointerLock ||

document.body.webkitRequestPointerLock

;

//解除鼠标锁定

document.exitPointerLock =

document.exitPointerLock ||

document.mozExitPointerLock ||

document.webkitExitPointerLock

;

//遮罩层事件

help.addEventListener(“click”, function (){

/* if (stop){ //请求解除指针锁定

document.exitPointerLock =

document.exitPointerLock ||

document.mozExitPointerLock ||

document.webkitExitPointerLock

;

document.exitPointerLock();

}else{ */

document.body.requestPointerLock();

stop = false;

playBGM();

// }

}, false);

//输入锁定改变事件

let pointerLockChangeEvent = function(){

if (typeof stop == “string”)

return;

if (

document.pointerLockElement === document.body ||

document.mozPointerLockElement === document.body ||

document.webkitPointerLockElement === document.body

){ //已锁定

console.log(“pointerLock yes”);

stop = false;

$(“#help”).css(“display”, “none”);

}else{ //未锁定

console.log(“pointerLock no”);

stop = true;

$(“#help”).css(“display”, “inline-block”);

SQL_save();

}

};

//输入锁定改变错误

let pointerLockErrorEvent = function(){

console.error(“鼠标锁定错误”);

alert(“鼠标锁定错误\n请关闭重新打开 或 切换/升级浏览器”);

};

//添加锁定事件

document.addEventListener(“pointerlockchange”, pointerLockChangeEvent, false);

document.addEventListener(“mozpointerlockchange”, pointerLockChangeEvent, false);

document.addEventListener(“webkitpointerlockchange”, pointerLockChangeEvent, false);

document.addEventListener(“pointerlockerror”, pointerLockErrorEvent, false);

document.addEventListener(“mozpointerlockerror”, pointerLockErrorEvent, false);

document.addEventListener(“webkitpointerlockerror”, pointerLockErrorEvent, false);

}

function ray2D(phone, x, y){

let raycaster = new THREE.Raycaster(); //光线投射,用于确定鼠标点击位置

let mouse = new THREE.Vector2(); //创建二维平面

mouse.x = phone? 2*(x/WIDTH)-1: 0;

mouse.y = phone? -2*(y/HEIGHT)+1: 0;

//mouse.x = phone? (x/window.innerWidth)*0.9-0.6: 0;

//mouse.y = phone? (y/window.innerHeight)*1.8-0.6: 0;

//console.log(“get:”, x, y, mouse.x, mouse.y);

//以camera为z坐标,确定所点击物体的3D空间位置

raycaster.setFromCamera(mouse, camera);

//确定所点击位置上的物体数量

let intersects = raycaster.intersectObjects(scene.children);

//选中后进行的操作

if(intersects.length){

return intersects;

}

return null;

}

//屏蔽鼠标右键

document.oncontextmenu = function (e){

var e = e || window.event;

e.returnValue = false;

return false;

};

function GetQueryString(name){

var reg = new RegExp(“(^|&)”+ name +“=([^&]*)(&|$)”);

var r = window.location.search.substr(1).match(reg);

if(r!=null)return unescape(r[2]); return null;

}

function message(text, time=5){

/*if (navigator.userAgent.toLowerCase().indexOf(“html5plus”) != -1){

if (typeof plus != “undefined”){

plus.nativeUI.toast(

text,

{

type: “richtext”,

duration: time1,

verticalAlign: “top”,

richTextStyle: {

align:“center”,

}

}

);

}else{

document.addEventListener(“plusready”, function(){

plus.nativeUI.toast(

text,

{

type: “richtext”,

duration: time1,

verticalAlign: “top”,

richTextStyle: {

align:“center”,

}

}

);

});

}

}else{*/

let msg = ( ‘ (` ({text}`);

$(document.body).append(

msg.attr(“open”, “true”).hide()

);

msg.fadeIn(“slow”);

setTimeout(()=>{

msg.fadeOut(“slow”);

}, time*1000);

//}

}

function rnd_error(){

return Math.random()*0.2+0.9;

}

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
### 回答1: 好的,下面是一个简单的HTML代码示例,用于创建一个简单的白色网页: ``` <!DOCTYPE html> <html> <head> <title>白色网页</title> </head> <body style="background-color: white;"> <h1>欢迎来到我的白色网页</h1> <p>这是一个简单的网页,背景为白色。</p> </body> </html> ``` 在这个示例中,`<!DOCTYPE html>`定义了文档类型,告诉浏览器使用HTML5解析文档。`<html>`标签是HTML文档的根元素。`<head>`标签包含了文档的元数据,比如网页的标题。`<title>`标签定义了网页的标题,会显示在浏览器的标签页上。`<body>`标签包含了网页的主要内容。`style`属性定义了网页的背景颜色为白色。`<h1>`标签定义了一个一级标题,`<p>`标签定义了一个段落。 ### 回答2: 我爱你,这三个字,代表了我对你无尽的思念和深深的情感。为了表达我对你的爱意,我决定用HTML一个表白网页。 首先,在网页的顶部设置一个浪漫的背景色,例如粉色或红色,以突出爱的主题。然后,在页面的中央放置一张我们的合照,展示我们的美好回忆。 接下来,我会在网页的正中央用大号字体下“亲爱的XX”,将你的名字替换到XX的位置上,以显示我对你的特殊称呼和重要性。 在下方,我会用一段简短的文字,用几句温馨的话表达我对你的爱和对未来的美好期待。我会使用字体和颜色来强调我对你的独特情感。 然后,我会在页面的最底部加上我们共同喜欢的歌曲,通过插入一个音乐播放器,让你能在浏览网页的同时欣赏到我们共同喜爱的音乐。 最后,我会在页面的右下角加上一个可爱的表白按钮,点击这个按钮将直接链接到一封专门为你的爱情信函,里面尽情表达我对你的爱和渴望与你共度一生的愿望。 通过这个表白网页,我希望能够向你传递我内心深处的情感和爱意。无论你是否接受,我都希望你能感受到我那深深的爱和真心的付出。我愿意为你付出一切,并且永远不离不弃。 我爱你,希望你能看到这个网页,并且能够给予我一个美好的答复。 ### 回答3: 表白网页是一种浪漫的方式,可以用HTML来编。下面是一个用HTML的表白网页的示例。 ```html <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>表白网页</title> </head> <body> <h1>亲爱的XXX</h1> <p>我喜欢你已经很久了,今天我想用这个网页来向你表白。</p> <p>每次看到你,我的心都会跳个不停,你的笑容能照亮我整个世界。</p> <p>你的温柔、善良、聪明和幽默让我深深迷恋,我无法想象没有你的日子。</p> <p>我希望能够和你一起经历更多美好时光,我愿意为你付出我的一切。</p> <p>XXX,你愿意成为我的女朋友吗?</p> <p>希望收到你的回复,无论结果如何,我都会珍惜我们的友谊。</p> <p>愿天下有情人终成眷属。</p> <p>爱你的XXX</p> </body> </html> ``` 这个表白网页包括了一个标题,一些文字表达感情的段落,以及表白者的署名。 你可以直接将这段代码复制到一个文本编辑器中,将文件保存为`.html`格式,并在浏览器中打开,即可看到这个表白网页的效果。你可以修改`XXX`为你要表白的人的名字,也可以根据你的喜好和创意自由修改样式和布局。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值