my-test3 / index.html
Archger's picture
Add 2 files
256c08c verified
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>逻辑语言转换系统</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
.code-block {
font-family: 'Courier New', monospace;
background-color: #f3f4f6;
padding: 1rem;
border-radius: 0.5rem;
overflow-x: auto;
}
.section-card {
transition: all 0.3s ease;
}
.section-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}
.nav-item {
position: relative;
}
.nav-item::after {
content: '';
position: absolute;
width: 0;
height: 2px;
bottom: 0;
left: 0;
background-color: #3b82f6;
transition: width 0.3s ease;
}
.nav-item:hover::after {
width: 100%;
}
.progress-bar {
height: 6px;
background-color: #e5e7eb;
border-radius: 3px;
}
.progress-fill {
height: 100%;
border-radius: 3px;
background-color: #3b82f6;
transition: width 0.5s ease;
}
</style>
</head>
<body class="bg-gray-50">
<!-- 导航栏 -->
<nav class="bg-white shadow-md sticky top-0 z-50">
<div class="container mx-auto px-4 py-3 flex justify-between items-center">
<div class="flex items-center space-x-2">
<i class="fas fa-brain text-blue-500 text-2xl"></i>
<span class="text-xl font-bold text-gray-800">逻辑语言转换系统</span>
</div>
<div class="hidden md:flex space-x-8">
<a href="#section-1" class="nav-item text-gray-700 hover:text-blue-500 py-2">基础符号</a>
<a href="#section-2" class="nav-item text-gray-700 hover:text-blue-500 py-2">句法生成</a>
<a href="#section-3" class="nav-item text-gray-700 hover:text-blue-500 py-2">语音手势</a>
<a href="#section-4" class="nav-item text-gray-700 hover:text-blue-500 py-2">转换方法</a>
<a href="#section-5" class="nav-item text-gray-700 hover:text-blue-500 py-2">异常处理</a>
<a href="#section-6" class="nav-item text-gray-700 hover:text-blue-500 py-2">认证体系</a>
</div>
<button class="md:hidden text-gray-700">
<i class="fas fa-bars text-xl"></i>
</button>
</div>
</nav>
<!-- 英雄区域 -->
<header class="bg-gradient-to-r from-blue-600 to-blue-400 text-white py-16">
<div class="container mx-auto px-4 text-center">
<h1 class="text-4xl md:text-5xl font-bold mb-6">逻辑语言转换系统</h1>
<p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto">基于ISO/IEC 24707标准的12,000个设计要点构建的完整技术规格与转换方法论</p>
<div class="flex flex-col md:flex-row justify-center gap-4">
<button class="bg-white text-blue-600 hover:bg-blue-50 px-6 py-3 rounded-lg font-semibold shadow-md transition duration-300">
<i class="fas fa-book mr-2"></i>技术文档
</button>
<button class="bg-blue-700 hover:bg-blue-800 px-6 py-3 rounded-lg font-semibold shadow-md transition duration-300">
<i class="fas fa-user-plus mr-2"></i>申请转换
</button>
</div>
</div>
</header>
<!-- 主要内容 -->
<main class="container mx-auto px-4 py-12">
<!-- 简介部分 -->
<section class="mb-16 bg-white rounded-xl shadow-lg p-8">
<h2 class="text-3xl font-bold text-gray-800 mb-6">系统简介</h2>
<div class="grid md:grid-cols-3 gap-8">
<div class="bg-blue-50 p-6 rounded-lg">
<div class="text-blue-500 text-3xl mb-4">
<i class="fas fa-atom"></i>
</div>
<h3 class="text-xl font-semibold mb-2">基础符号系统</h3>
<p class="text-gray-600">兼容ISO/IEC 24707标准的扩展符号体系,包含4000个原子词根库和逻辑运算符音素映射表。</p>
</div>
<div class="bg-purple-50 p-6 rounded-lg">
<div class="text-purple-500 text-3xl mb-4">
<i class="fas fa-project-diagram"></i>
</div>
<h3 class="text-xl font-semibold mb-2">Chomsky层级扩展</h3>
<p class="text-gray-600">3型文法扩展的句法生成规则,包含反事实条件句处理和合法语句生成协议。</p>
</div>
<div class="bg-green-50 p-6 rounded-lg">
<div class="text-green-500 text-3xl mb-4">
<i class="fas fa-hands"></i>
</div>
<h3 class="text-xl font-semibold mb-2">语音-手势系统</h3>
<p class="text-gray-600">符合ITU-T P.1100标准的三维手势逻辑标记和纠偏反馈机制。</p>
</div>
</div>
</section>
<!-- 转换成功率统计 -->
<section class="mb-16 bg-gradient-to-r from-purple-600 to-blue-600 text-white rounded-xl shadow-lg p-8">
<h2 class="text-3xl font-bold mb-6">转换成功率统计</h2>
<div class="grid md:grid-cols-2 gap-8">
<div>
<div class="mb-4">
<div class="flex justify-between mb-1">
<span class="font-medium">18-25岁群体</span>
<span class="font-bold">92.7%</span>
</div>
<div class="progress-bar">
<div class="progress-fill" style="width: 92.7%"></div>
</div>
</div>
<div>
<div class="flex justify-between mb-1">
<span class="font-medium">40岁以上群体</span>
<span class="font-bold">43.5%</span>
</div>
<div class="progress-bar">
<div class="progress-fill" style="width: 43.5%"></div>
</div>
</div>
</div>
<div class="bg-white bg-opacity-20 p-6 rounded-lg">
<h3 class="text-xl font-semibold mb-3">杏仁核抑制治疗</h3>
<p class="mb-4">40岁以上转换者需进行额外的杏仁核抑制治疗,以提高转换成功率。</p>
<button class="bg-white text-purple-600 hover:bg-purple-100 px-4 py-2 rounded-lg font-medium">
了解更多 <i class="fas fa-chevron-right ml-1"></i>
</button>
</div>
</div>
</section>
<!-- 技术规格部分 -->
<section id="section-1" class="mb-16">
<div class="section-card bg-white rounded-xl shadow-lg overflow-hidden">
<div class="bg-blue-600 text-white px-6 py-4">
<h2 class="text-2xl font-bold flex items-center">
<i class="fas fa-cube mr-3"></i>Ⅰ. 基础符号系统(ISO/IEC 24707兼容扩展)
</h2>
</div>
<div class="p-6">
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-dna mr-2 text-blue-500"></i>1. 原子词根库(核心4000词)
</h3>
<div class="code-block mb-6">
<pre><code>type 实体词 = `${string}-类` | `${string}-个体`; // 例:猫-类、薛定谔的猫-个体
type 谓词 = `${动作}[${参数标签}:${类型}]`; // 例:吃[施事:动物-类, 受事:食物-类]
type 量词 = "凡" | "存" | "恰存"; // 对应∀, ∃, ∃!</code></pre>
</div>
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-volume-up mr-2 text-blue-500"></i>2. 逻辑运算符音素映射表
</h3>
<div class="overflow-x-auto mb-6">
<table class="min-w-full bg-white border border-gray-200">
<thead class="bg-gray-100">
<tr>
<th class="py-2 px-4 border-b font-semibold">运算符</th>
<th class="py-2 px-4 border-b font-semibold">发音规则</th>
<th class="py-2 px-4 border-b font-semibold">唇形监测要求</th>
</tr>
</thead>
<tbody>
<tr class="hover:bg-gray-50">
<td class="py-2 px-4 border-b text-center">¬</td>
<td class="py-2 px-4 border-b">舌尖抵上齿龈爆破音/n̥/</td>
<td class="py-2 px-4 border-b">嘴角下垂≥5mm</td>
</tr>
<tr class="hover:bg-gray-50">
<td class="py-2 px-4 border-b text-center"></td>
<td class="py-2 px-4 border-b">喉塞化元音/aʔ/</td>
<td class="py-2 px-4 border-b">双唇紧闭0.3秒</td>
</tr>
<tr class="hover:bg-gray-50">
<td class="py-2 px-4 border-b text-center"></td>
<td class="py-2 px-4 border-b">升调阳平转去声(˧˥→˥˩)</td>
<td class="py-2 px-4 border-b">眉弓抬高触发传感器</td>
</tr>
</tbody>
</table>
</div>
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-shapes mr-2 text-blue-500"></i>3. 类型论实施标准
</h3>
<div class="code-block">
<pre><code>(* 多态类型递归定义 *)
Inductive 类型 :=
| 基类 : String → 类型
| 函类 : 类型 → 类型 → 类型
| 积类 : 类型 → 类型 → 类型.
Notation "人类" := (基类 "人").
Notation "动物 → 行为" := (函类 动物 行为).</code></pre>
</div>
</div>
</div>
</section>
<section id="section-2" class="mb-16">
<div class="section-card bg-white rounded-xl shadow-lg overflow-hidden">
<div class="bg-purple-600 text-white px-6 py-4">
<h2 class="text-2xl font-bold flex items-center">
<i class="fas fa-sitemap mr-3"></i>Ⅱ. 句法生成规则(Chomsky层级3型文法扩展)
</h2>
</div>
<div class="p-6">
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-file-code mr-2 text-purple-500"></i>1. 合法语句的生成协议
</h3>
<div class="code-block mb-6">
<pre><code>&lt;句子&gt; ::= &lt;原子命题&gt; | &lt;复合命题&gt;
&lt;原子命题&gt; ::= &lt;谓词&gt;(&lt;实体列表&gt;)[时态][模态]
&lt;复合命题&gt; ::= [量词]&lt;变量&gt;&lt;类型&gt;: &lt;条件&gt;&lt;结论&gt;
| ¬&lt;命题&gt;
| &lt;命题&gt;&lt;逻辑符&gt;&lt;命题&gt;
实体列表 ::= &lt;实体词&gt; {, &lt;实体词&gt;}
时态 ::= @过去(t) | @现在(持续) | @将来(p)
模态 ::= □ | ◇ | K[认知主体]</code></pre>
</div>
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-question-circle mr-2 text-purple-500"></i>2. 反事实条件句处理
</h3>
<div class="code-block">
<pre><code>反事实(条件φ, 结论ψ) :-
显式标记虚拟语气(φ, 标记为□◇φ),
建立可能世界模型(w1 ⊨ φ ∧ ψ, w0 ¬φ),
跨世界可通达验证(w0Rw1).</code></pre>
</div>
</div>
</div>
</section>
<section id="section-3" class="mb-16">
<div class="section-card bg-white rounded-xl shadow-lg overflow-hidden">
<div class="bg-green-600 text-white px-6 py-4">
<h2 class="text-2xl font-bold flex items-center">
<i class="fas fa-hands-helping mr-3"></i>Ⅲ. 语音-手势综合系统(符合ITU-T P.1100标准)
</h2>
</div>
<div class="p-6">
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-hand-paper mr-2 text-green-500"></i>1. 三维手势逻辑标记
</h3>
<div class="code-block mb-6">
<pre><code>struct 手势 {
vector3 空间轨迹; // 笛卡尔坐标系记录
float 停留时长; // 单位:毫秒
uint8_t 手指状态; // 位掩码表示手指曲张
};
const 手势 全称量词手势 = {
.空间轨迹 = 立方体右上→左下对角线,
.停留时长 = 500ms,
.手指状态 = 0b11110 // 仅小指弯曲
};</code></pre>
</div>
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-bell mr-2 text-green-500"></i>2. 纠偏反馈机制
</h3>
<div class="code-block">
<pre><code>def 逻辑纯度检测(语音流, 手势序列):
异常点 = []
for 帧 in 同步对齐(语音流, 手势序列):
if not 符合同步协议(帧):
异常点.append(帧时间戳)
施加触觉反馈(强度=0.7N)
return 生成纠错报告(异常点)</code></pre>
</div>
</div>
</div>
</section>
<section id="section-4" class="mb-16">
<div class="section-card bg-white rounded-xl shadow-lg overflow-hidden">
<div class="bg-yellow-600 text-white px-6 py-4">
<h2 class="text-2xl font-bold flex items-center">
<i class="fas fa-exchange-alt mr-3"></i>Ⅳ. 中文母语者转换方法论
</h2>
</div>
<div class="p-6">
<div class="grid md:grid-cols-3 gap-6 mb-8">
<div class="bg-yellow-50 p-5 rounded-lg border border-yellow-200">
<div class="flex items-center mb-3">
<div class="bg-yellow-100 text-yellow-600 p-2 rounded-full mr-3">
<i class="fas fa-layer-group"></i>
</div>
<h3 class="text-lg font-semibold">阶段1:意识解构(6个月)</h3>
</div>
<div class="code-block">
<pre><code>训练模块 = {
① 语义成分分析:将"下雨天留客"拆解为:
天气状态[类型=降水, 时间=现在]
人类行为[主体=客人, 动作=停留]
因果关系[前提=天气状态, 结果=行为]
② 逻辑谬误注射训练:
每周植入10个隐藏谬误命题,要求学员识别并修正
③ AR词性视觉化:
实体词显示蓝色边框,谓词红色脉冲光,量词绿色旋转体
}</code></pre>
</div>
</div>
<div class="bg-blue-50 p-5 rounded-lg border border-blue-200">
<div class="flex items-center mb-3">
<div class="bg-blue-100 text-blue-600 p-2 rounded-full mr-3">
<i class="fas fa-code"></i>
</div>
<h3 class="text-lg font-semibold">阶段2:表达重构(12个月)</h3>
</div>
<div class="code-block">
<pre><code>// 语句生成约束算法
fn 中文转换(input: &str) -> Result&lt;逻辑句, 错误类型&gt; {
let 依存树 = 解析中文(input)?;
let 逻辑中间表示 = 应用转换规则(依存树)?;
逻辑句::验证(逻辑中间表示)
}
// 转换规则示例
转换规则! {
r#"如果(\S+)就(\S+)"# => "【→】($1, $2)",
r#"不是(\S+)"# => "【¬】$1"
}</code></pre>
</div>
</div>
<div class="bg-purple-50 p-5 rounded-lg border border-purple-200">
<div class="flex items-center mb-3">
<div class="bg-purple-100 text-purple-600 p-2 rounded-full mr-3">
<i class="fas fa-brain"></i>
</div>
<h3 class="text-lg font-semibold">阶段3:神经重塑(终身维护)</h3>
</div>
<div class="code-block">
<pre><code># 植入式脑机接口协议
class 语言神经重映射:
def __init__(self):
self.brodmann_area = [44, 45] # 布洛卡区
def 抑制自然语言(self, 强度: float):
发送电刺激(区域=21区, 频率=40Hz, 强度=强度)
def 强化逻辑语法(self):
诱导神经可塑性(突触权重更新规则=
Δw = η * (逻辑正确率 - 0.9) * 输入激活)</code></pre>
</div>
</div>
</div>
<div class="bg-gray-100 p-6 rounded-lg">
<h3 class="text-xl font-semibold text-gray-800 mb-4">完整转换流程</h3>
<div class="space-y-4">
<div class="flex items-start">
<div class="bg-blue-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-4">1</div>
<div>
<h4 class="font-medium">脑机接口手术</h4>
<p class="text-gray-600 text-sm">在左侧颞叶植入逻辑协处理器(符合ISO/IEC 30128神经接口标准)</p>
</div>
</div>
<div class="flex items-start">
<div class="bg-blue-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-4">2</div>
<div>
<h4 class="font-medium">三年强化训练</h4>
<p class="text-gray-600 text-sm">每天4小时在虚拟现实逻辑竞技场进行命题对战</p>
</div>
</div>
<div class="flex items-start">
<div class="bg-blue-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-4">3</div>
<div>
<h4 class="font-medium">社会身份重置</h4>
<p class="text-gray-600 text-sm">获得新的逻辑公民ID,旧自然语言使用将受信用分惩罚</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="section-5" class="mb-16">
<div class="section-card bg-white rounded-xl shadow-lg overflow-hidden">
<div class="bg-red-600 text-white px-6 py-4">
<h2 class="text-2xl font-bold flex items-center">
<i class="fas fa-exclamation-triangle mr-3"></i>Ⅴ. 异常处理与边缘案例
</h2>
</div>
<div class="p-6">
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-paragraph mr-2 text-red-500"></i>1. 悖论处理协议
</h3>
<div class="code-block mb-6">
<pre><code>data 命题状态 = 合法 | 悖论 | 未定
handleParadox :: 命题 -> IO 命题状态
handleParadox p
| p == ¬p = 启动共识协议(30秒内全网投票)
| 引发罗素悖论 = 强制类型提升到更高阶宇宙
| otherwise = 记录到异常日志等待人工审核</code></pre>
</div>
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-paint-brush mr-2 text-red-500"></i>2. 诗性表达特许区
</h3>
<div class="code-block">
<pre><code>{
"特许域": "诗域",
"允许操作": ["隐喻", "转喻", "通感"],
"约束条件": [
"需用声纹加密标记[诗]",
"接收方必须启用诗域解码器",
"逻辑纯度降至Level 0"
]
}</code></pre>
</div>
</div>
</div>
</section>
<section id="section-6" class="mb-16">
<div class="section-card bg-white rounded-xl shadow-lg overflow-hidden">
<div class="bg-indigo-600 text-white px-6 py-4">
<h2 class="text-2xl font-bold flex items-center">
<i class="fas fa-certificate mr-3"></i>Ⅵ. 认证与进化体系
</h2>
</div>
<div class="p-6">
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-level-up-alt mr-2 text-indigo-500"></i>1. 九级认证标准
</h3>
<div class="overflow-x-auto mb-6">
<table class="min-w-full bg-white border border-gray-200">
<thead class="bg-gray-100">
<tr>
<th class="py-2 px-4 border-b font-semibold">等级</th>
<th class="py-2 px-4 border-b font-semibold">要求</th>
<th class="py-2 px-4 border-b font-semibold">脑区改造程度</th>
</tr>
</thead>
<tbody>
<tr class="hover:bg-gray-50">
<td class="py-2 px-4 border-b text-center font-medium">Lv1</td>
<td class="py-2 px-4 border-b">处理单层命题</td>
<td class="py-2 px-4 border-b">布洛卡区5%</td>
</tr>
<tr class="hover:bg-gray-50">
<td class="py-2 px-4 border-b text-center font-medium">Lv5</td>
<td class="py-2 px-4 border-b">处理三层模态嵌套</td>
<td class="py-2 px-4 border-b">Wernicke区30%</td>
</tr>
<tr class="hover:bg-gray-50">
<td class="py-2 px-4 border-b text-center font-medium">Lv9</td>
<td class="py-2 px-4 border-b">参与类型论宇宙扩容投票</td>
<td class="py-2 px-4 border-b">全语言区90%</td>
</tr>
</tbody>
</table>
</div>
<h3 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
<i class="fas fa-code-branch mr-2 text-indigo-500"></i>2. 集体进化机制
</h3>
<div class="code-block">
<pre><code>// 基于区块链的语法更新智能合约
contract 语言进化 {
address[] 持票人; // 需Lv7以上证书
function 提案修改语法(bytes32 提案ID) public {
require(认证等级[msg.sender] >= 7);
发起投票(提案ID, 7天);
}
function 执行修改(uint 提案ID) public {
if (赞成票 > 总票数⅔) {
更新全球语法库(提案内容);
强制神经同步更新();
}
}
}</code></pre>
</div>
</div>
</div>
</section>
<!-- 测试结果部分 -->
<section class="mb-16 bg-white rounded-xl shadow-lg p-8">
<h2 class="text-3xl font-bold text-gray-800 mb-6">β测试结果</h2>
<div class="bg-gray-100 p-6 rounded-lg mb-6">
<p class="text-lg mb-4">此系统已在[数据删除]特别行政区完成β测试,实现全区法庭辩论零歧义判决。</p>
<p class="text-lg">完整技术规范见《GB/T 20988-202X 逻辑汉语实施指南》。</p>
</div>
<div class="grid md:grid-cols-2 gap-6">
<div class="bg-indigo-50 p-6 rounded-lg">
<h3 class="text-xl font-semibold mb-3">技术优势</h3>
<ul class="space-y-2">
<li class="flex items-start">
<i class="fas fa-check-circle text-indigo-500 mt-1 mr-2"></i>
<span>12,000个设计要点的完整逻辑语言体系</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-indigo-500 mt-1 mr-2"></i>
<span>分层递归式描述保证技术严谨性</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-indigo-500 mt-1 mr-2"></i>
<span>符合多项国际标准(ISO/IEC 24707, ITU-T P.1100等)</span>
</li>
</ul>
</div>
<div class="bg-green-50 p-6 rounded-lg">
<h3 class="text-xl font-semibold mb-3">应用场景</h3>
<ul class="space-y-2">
<li class="flex items-start">
<i class="fas fa-gavel text-green-500 mt-1 mr-2"></i>
<span>法律文书与法庭辩论</span>
</li>
<li class="flex items-start">
<i class="fas fa-flask text-green-500 mt-1 mr-2"></i>
<span>科学研究与技术文档</span>
</li>
<li class="flex items-start">
<i class="fas fa-robot text-green-500 mt-1 mr-2"></i>
<span>人工智能逻辑推理</span>
</li>
</ul>
</div>
</div>
</section>
<!-- 行动号召 -->
<section class="bg-gradient-to-r from-blue-500 to-purple-600 text-white rounded-xl shadow-lg p-8 text-center">
<h2 class="text-3xl font-bold mb-4">准备好开始您的逻辑语言转换了吗?</h2>
<p class="text-xl mb-8 max-w-2xl mx-auto">加入数千名已经完成转换的逻辑公民,体验无歧义、高精度的思维与交流方式。</p>
<button class="bg-white text-blue-600 hover:bg-blue-100 px-8 py-4 rounded-lg font-semibold text-lg shadow-lg transition duration-300">
立即申请 <i class="fas fa-arrow-right ml-2"></i>
</button>
</section>
</main>
<!-- 页脚 -->
<footer class="bg-gray-800 text-white py-12">
<div class="container mx-auto px-4">
<div class="grid md:grid-cols-4 gap-8 mb-8">
<div>
<h3 class="text-xl font-bold mb-4 flex items-center">
<i class="fas fa-brain mr-2"></i> 逻辑语言转换系统
</h3>
<p class="text-gray-400">基于ISO/IEC 24707标准的12,000个设计要点构建的完整技术规格与转换方法论。</p>
</div>
<div>
<h4 class="text-lg font-semibold mb-4">技术规范</h4>
<ul class="space-y-2">
<li><a href="#" class="text-gray-400 hover:text-white">ISO/IEC 24707</a></li>
<li><a href="#" class="text-gray-400 hover:text-white">ITU-T P.1100</a></li>
<li><a href="#" class="text-gray-400 hover:text-white">GB/T 20988-202X</a></li>
</ul>
</div>
<div>
<h4 class="text-lg font-semibold mb-4">快速链接</h4>
<ul class="space-y-2">
<li><a href="#" class="text-gray-400 hover:text-white">文档中心</a></li>
<li><a href="#" class="text-gray-400 hover:text-white">转换申请</a></li>
<li><a href="#" class="text-gray-400 hover:text-white">培训课程</a></li>
</ul>
</div>
<div>
<h4 class="text-lg font-semibold mb-4">联系我们</h4>
<ul class="space-y-2">
<li class="flex items-center">
<i class="fas fa-envelope mr-2 text-gray-400"></i>
<span>support@logiclang.org</span>
</li>
<li class="flex items-center">
<i class="fas fa-phone-alt mr-2 text-gray-400"></i>
<span>400-123-4567</span>
</li>
<li class="flex items-center">
<i class="fas fa-map-marker-alt mr-2 text-gray-400"></i>
<span>[数据删除]特别行政区</span>
</li>
</ul>
</div>
</div>
<div class="border-t border-gray-700 pt-8 text-center text-gray-400">
<p>© 2023 逻辑语言转换系统. 保留所有权利.</p>
</div>
</div>
</footer>
<script>
// 平滑滚动
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
document.querySelector(this.getAttribute('href')).scrollIntoView({
behavior: 'smooth'
});
});
});
// 响应式导航菜单
const mobileMenuButton = document.querySelector('.md\\:hidden');
const mobileMenu = document.querySelector('.hidden.md\\:flex');
mobileMenuButton.addEventListener('click', () => {
mobileMenu.classList.toggle('hidden');
mobileMenu.classList.toggle('flex');
mobileMenu.classList.toggle('flex-col');
mobileMenu.classList.toggle('absolute');
mobileMenu.classList.toggle('top-16');
mobileMenu.classList.toggle('right-4');
mobileMenu.classList.toggle('bg-white');
mobileMenu.classList.toggle('shadow-lg');
mobileMenu.classList.toggle('rounded-lg');
mobileMenu.classList.toggle('p-4');
mobileMenu.classList.toggle('space-y-2');
mobileMenu.classList.toggle('space-x-8');
});
// 卡片悬停效果
const sectionCards = document.querySelectorAll('.section-card');
sectionCards.forEach(card => {
card.addEventListener('mouseenter', () => {
card.style.transform = 'translateY(-5px)';
card.style.boxShadow = '0 10px 25px rgba(0, 0, 0, 0.1)';
});
card.addEventListener('mouseleave', () => {
card.style.transform = '';
card.style.boxShadow = '';
});
});
</script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - <a href="https://enzostvs-deepsite.hf.space?remix=Archger/my-test3" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body>
</html>