<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>首页</title>
<style>
header {
text-align: right;
}
#change-feeling {
text-decoration: none;
font-size: small;
}
#form-section {
text-align: center;
margin-top: 1em;
padding-top: 100px;
}
#input {
width: 40em;
padding: 0.5em 0.2em;
font-size: large;
}
</style>
<script>
function changeFeeling(feeling) {
var now = new Date();
var nextYear = new Date(now.getTime() + 3600000 * 24 * 365);
document.cookie = 'feeling=' + feeling + '; expires=' + nextYear.toGMTString();
location.reload();
}
</script>
</head>
<body>
<header>
<?php
if (array_key_exists('feeling', $_COOKIE)) {
$feeling = $_COOKIE['feeling'];
} else {
$feeling = 'old';
}
if ($feeling === 'new') {
echo <<<EOT
<style class="feeling">
body {
background: #80E0F0;
}
#input {
height: 2em;
font-family: "微软雅黑";
}
</style>
<a id=change-feeling href="javascript:changeFeeling('old');">返回旧版</a>
EOT;
} else {
echo <<<EOT
<a id=change-feeling href="javascript:changeFeeling('new');">使用新版</a>
EOT;
}
?>
</header>
<section id=form-section>
<input id=input>
</section>
</body>
</html>Copy after login
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
