夏至を受け入れる：科学、伝統、お祝いの冬のワンダーランド

冬至のお祝い


本文 {
; font-family: 'Montserrat'、サンセリフ;
マージン: 0;
パディング: 0;
背景: 線形グラデーション(下へ、#1a1a2e、#16213e、#0f3460);
色: #fff;
オーバーフロー-x: 非表示;
}
body::before {
コンテンツ: '';
; 位置: 固定;
上: 0;
左: 0;
幅: 100%;
高さ: 100%;
背景: url('https://source.unsplash.com/1600x900/?snow ,forest') リピートなし センター センター/カバー;
不透明度: 0.5;
z インデックス: -1;
}
ヘッダー {
text-align: center;
パディング: 50px 20px;
背景: rgba(0, 0, 0, 0.7);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}
ヘッダー h1 {
font-size: 2.5rem;
margin-bottom: 10px;
}
header nav ul {
リストスタイル: なし;
パディング: 0;
表示: flex;
justify-content: center;
ギャップ: 20px;
}
header nav ul li a {
テキスト装飾: なし;
色: #00d4ff;
フォントの太さ: 700;
トランジション: カラー 0.3 秒のイーズ;
}
header nav ul li a:hover {
色: #ff69b4;
}
セクション {
パディング: 40px 20px;
マージン: 20px auto;
最大幅: 900px;
背景: rgba(255, 255, 255, 0.1);
境界半径: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}
セクション h2 {
色: #00d4ff;
text-align: center;
margin-bottom: 20px;
}
.celebration {
border-bottom: 1px ソリッド rgba(255, 255, 255, 0.3);
パディングボトム: 20px;
margin-bottom: 20px;
}
.celebration:last-child {
border-bottom: なし;
margin-bottom: 0;
}
.snowflake {
位置: 絶対;
上: -10px;
font-size: 1.5rem;
色: #fff;
アニメーション: フォール 10 秒リニア無限;
不透明度: 0.8;
}
@keyframes が落ちる {
0% {
変換: 変換Y(-100px) 回転(0度);
左: calc(100% * var(--x-start));
}
100% {
変換: 移動 Y(100vh) 回転(360 度);
左: calc(100% * var(--x-end));
}
}
フッター {
text-align: center;
パディング: 20px;
背景: rgba(0, 0, 0, 0.7);
box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.5);
色: #bbb;
}
フッター ナビゲーション {
リストスタイル: なし;
パディング: 0;
表示: flex;
justify-content: center;
ギャップ: 15px;
}
フッター ナビゲーション {
テキスト装飾: なし;
色: #00d4ff;
トランジション: カラー 0.3 秒のイーズ;
}
フッター ナビゲーション ul li a:hover {
色: #ff69b4;
}
.customize-panel {
位置: 固定;
上: 20px;
右: 20px;
背景: rgba(0, 0, 0, 0.7);
パディング: 15px;
境界半径: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
z インデックス: 1000;
}
.customize-panel ラベル {
表示: ブロック;
margin-bottom: 10px;
font-size: 0.9rem;
色: #fff;
}
.customize-panel input[type="range"] {
幅: 100%;
}

冬至を祝う

• はじめに
• 科学
• 半球全体
• お祝い
• 伝統
• 結論

<section>


<pre class="brush:php;toolbar:false">

以上が夏至を受け入れる：科学、伝統、お祝いの冬のワンダーランドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。