2026年3月31日 星期二

2026.03.31 第一次接觸學校網站前置作業 健康管理系 （電腦小筆記）

 <!DOCTYPE html>

<html lang="zh-TW">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>開南大學 健康產業管理學系 | AI元年 世代領航</title>

    <!-- 引入 Tailwind CSS 進行快速、現代化的排版與樣式設計 -->

    <script src="https://cdn.tailwindcss.com"></script>

    <!-- 引入 FontAwesome 獲得科技與醫療圖示 -->

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

    <!-- Google Fonts: Noto Sans TC -->

    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700;900&display=swap" rel="stylesheet">

    

    <script>

        // 設定 Tailwind 自訂色彩主題

        tailwind.config = {

            theme: {

                extend: {

                    fontFamily: {

                        sans: ['"Noto Sans TC"', 'sans-serif'],

                    },

                    colors: {

                        tech: {

                            dark: '#0B1120',    // 深邃科技藍

                            primary: '#0EA5E9', // 科技青

                            accent: '#38BDF8',  // 發光亮藍

                        },

                        health: {

                            primary: '#10B981', // 醫療綠

                            light: '#D1FAE5',   // 淺綠背景

                        }

                    },

                    animation: {

                        'gradient-x': 'gradient-x 15s ease infinite',

                        'float': 'float 3s ease-in-out infinite',

                    },

                    keyframes: {

                        'gradient-x': {

                            '0%, 100%': {

                                'background-size': '200% 200%',

                                'background-position': 'left center'

                            },

                            '50%': {

                                'background-size': '200% 200%',

                                'background-position': 'right center'

                            },

                        },

                        'float': {

                            '0%, 100%': { transform: 'translateY(0)' },

                            '50%': { transform: 'translateY(-10px)' },

                        }

                    }

                }

            }

        }

    </script>

    <style>

        /* 玻璃擬態 (Glassmorphism) 特效 */

        .glass-card {

            background: rgba(255, 255, 255, 0.05);

            backdrop-filter: blur(10px);

            -webkit-backdrop-filter: blur(10px);

            border: 1px solid rgba(255, 255, 255, 0.1);

            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

        }

        

        .glass-card-light {

            background: rgba(255, 255, 255, 0.9);

            backdrop-filter: blur(10px);

            border: 1px solid rgba(255, 255, 255, 0.5);

            box-shadow: 0 8px 32px rgba(31, 38, 135, 0.07);

        }


        /* 漸層文字特效 */

        .text-gradient {

            background: linear-gradient(to right, #38BDF8, #10B981);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

        }


        /* 隱藏滾動條但保留功能 */

        ::-webkit-scrollbar {

            width: 8px;

        }

        ::-webkit-scrollbar-track {

            background: #f1f1f1; 

        }

        ::-webkit-scrollbar-thumb {

            background: #888; 

            border-radius: 4px;

        }

        ::-webkit-scrollbar-thumb:hover {

            background: #555; 

        }

    </style>

</head>

<body class="font-sans antialiased text-gray-800 bg-slate-50 selection:bg-tech-primary selection:text-white">


    <!-- 導覽列 Navbar -->

    <nav class="fixed w-full z-50 transition-all duration-300 glass-card-light" id="navbar">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">

            <div class="flex justify-between items-center h-20">

                <!-- Logo 區域 -->

                <div class="flex-shrink-0 flex items-center gap-3 cursor-pointer">

                    <!-- 使用 FontAwesome 醫療十字與科技網路的意象 -->

                    <div class="w-10 h-10 rounded-lg bg-gradient-to-br from-tech-primary to-health-primary flex items-center justify-center text-white text-xl shadow-lg shadow-tech-primary/30">

                        <i class="fa-solid fa-staff-snake"></i>

                    </div>

                    <div>

                        <h1 class="text-xl font-bold tracking-wider text-slate-800 leading-tight">開南大學</h1>

                        <h2 class="text-sm font-semibold text-tech-primary tracking-widest">健康產業管理學系</h2>

                    </div>

                </div>

                

                <!-- 桌面版選單 -->

                <div class="hidden md:flex space-x-8 items-center">

                    <a href="#" class="text-slate-600 hover:text-tech-primary font-medium transition-colors">最新消息</a>

                    <a href="#" class="text-slate-600 hover:text-tech-primary font-medium transition-colors">系所簡介</a>

                    <a href="#" class="text-slate-600 hover:text-tech-primary font-medium transition-colors">師資陣容</a>

                    <a href="#ai-vision" class="text-slate-600 hover:text-tech-primary font-medium transition-colors">AI 發展願景</a>

                    <a href="#pdf-section" class="px-5 py-2 rounded-full bg-tech-dark text-white font-medium hover:bg-slate-800 transition-all shadow-md hover:shadow-lg transform hover:-translate-y-0.5"><i class="fa-solid fa-passport mr-2"></i>數位職能護照</a>

                </div>


                <!-- 手機版選單按鈕 -->

                <div class="md:hidden flex items-center">

                    <button class="text-slate-600 hover:text-tech-primary focus:outline-none">

                        <i class="fa-solid fa-bars text-2xl"></i>

                    </button>

                </div>

            </div>

        </div>

    </nav>


    <!-- 英雄區塊 Hero Section (結合科技感與健康感) -->

    <!-- 漸層背景：從深藍到醫療綠，加上動態漸層效果 -->

    <section class="relative pt-32 pb-20 lg:pt-48 lg:pb-32 overflow-hidden bg-gradient-to-br from-slate-900 via-tech-dark to-teal-900 animate-gradient-x">

        <!-- 裝飾性背景元素 -->

        <div class="absolute top-0 left-0 w-full h-full overflow-hidden opacity-20 pointer-events-none">

            <div class="absolute -top-24 -left-24 w-96 h-96 rounded-full bg-tech-primary blur-3xl mix-blend-screen"></div>

            <div class="absolute top-1/2 right-12 w-80 h-80 rounded-full bg-health-primary blur-3xl mix-blend-screen"></div>

            <!-- 模擬網格紋理 -->

            <div class="absolute inset-0" style="background-image: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px); background-size: 30px 30px;"></div>

        </div>


        <div class="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 z-10">

            <div class="text-center max-w-4xl mx-auto">

                <span class="inline-block py-1 px-3 rounded-full bg-white/10 text-health-light border border-white/20 backdrop-blur-md text-sm font-semibold tracking-widest mb-6 animate-float">

                    <i class="fa-solid fa-microchip mr-2"></i>史上最大的典範轉移

                </span>

                <h1 class="text-4xl md:text-6xl font-black text-white mb-6 leading-tight">

                    健康產業管理學系 <br>

                    <span class="text-gradient">AI 元年 2026</span>

                </h1>

                <p class="text-lg md:text-xl text-slate-300 mb-10 font-light leading-relaxed">

                    不只是時間節點，而是教育樣貌的全面重塑。<br>

                    以人工智慧為核心驅動力，我們拒絕只當觀眾，必須成為創造者，<br>

                    <span class="font-medium text-white">培育次世代健康革命領導者！</span>

                </p>

                <div class="flex flex-col sm:flex-row justify-center gap-4">

                    <a href="#ai-vision" class="px-8 py-4 rounded-lg bg-health-primary text-white font-bold text-lg hover:bg-emerald-400 transition-all shadow-[0_0_20px_rgba(16,185,129,0.4)] hover:shadow-[0_0_30px_rgba(16,185,129,0.6)] flex items-center justify-center">

                        探索 AI 交匯點 <i class="fa-solid fa-arrow-right ml-2"></i>

                    </a>

                    <a href="#pdf-section" class="px-8 py-4 rounded-lg glass-card text-white font-bold text-lg hover:bg-white/10 transition-all flex items-center justify-center border border-white/30">

                        <i class="fa-regular fa-file-pdf mr-2"></i> 檢視發展白皮書

                    </a>

                </div>

            </div>

            

            <!-- 數據條 -->

            <div class="mt-20 grid grid-cols-1 md:grid-cols-3 gap-6 text-center divide-y md:divide-y-0 md:divide-x divide-white/20 glass-card rounded-2xl p-8">

                <div class="p-4">

                    <h3 class="text-4xl font-black text-white mb-2">1,880億<span class="text-xl font-medium text-slate-400 ml-1">美元</span></h3>

                    <p class="text-tech-accent font-medium">2030年 AI 健康照護市場</p>

                </div>

                <div class="p-4">

                    <h3 class="text-4xl font-black text-white mb-2">37%</h3>

                    <p class="text-tech-accent font-medium">年複合成長率(CAGR) 高爆發</p>

                </div>

                <div class="p-4">

                    <h3 class="text-4xl font-black text-white mb-2">SDG 3 & 10</h3>

                    <p class="text-tech-accent font-medium">推動全民健康福祉與平權</p>

                </div>

            </div>

        </div>

    </section>


    <!-- AI 願景區塊 (卡片式佈局) -->

    <section id="ai-vision" class="py-24 bg-slate-50 relative">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">

            <div class="text-center mb-16">

                <h2 class="text-3xl md:text-4xl font-bold text-slate-800 mb-4">AI × 健康管理：無限可能的交匯點</h2>

                <div class="w-24 h-1 bg-gradient-to-r from-tech-primary to-health-primary mx-auto rounded-full mb-6"></div>

                <p class="text-slate-600 max-w-2xl mx-auto text-lg">

                    從單純的「AI 使用者」進化為「AI 醫療創新管理者」。我們的課程與實作涵蓋四大核心領域：

                </p>

            </div>


            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">

                <!-- 卡片 1 -->

                <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2 border-t-4 border-tech-primary group">

                    <div class="w-16 h-16 rounded-full bg-blue-50 flex items-center justify-center text-tech-primary text-2xl mb-6 group-hover:scale-110 transition-transform">

                        <i class="fa-solid fa-stethoscope"></i>

                    </div>

                    <h3 class="text-xl font-bold text-slate-800 mb-4">臨床與照護</h3>

                    <ul class="space-y-3 text-slate-600">

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> AI 輔助影像判讀</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 穿戴預測分析</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 防跌陪伴機器人</li>

                    </ul>

                </div>


                <!-- 卡片 2 -->

                <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2 border-t-4 border-health-primary group">

                    <div class="w-16 h-16 rounded-full bg-green-50 flex items-center justify-center text-health-primary text-2xl mb-6 group-hover:scale-110 transition-transform">

                        <i class="fa-solid fa-database"></i>

                    </div>

                    <h3 class="text-xl font-bold text-slate-800 mb-4">營運與大數據</h3>

                    <ul class="space-y-3 text-slate-600">

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 醫院排程最佳化</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 疾病風險預測</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 智慧醫材供應鏈</li>

                    </ul>

                </div>


                <!-- 卡片 3 -->

                <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2 border-t-4 border-purple-500 group">

                    <div class="w-16 h-16 rounded-full bg-purple-50 flex items-center justify-center text-purple-500 text-2xl mb-6 group-hover:scale-110 transition-transform">

                        <i class="fa-solid fa-flask"></i>

                    </div>

                    <h3 class="text-xl font-bold text-slate-800 mb-4">研發與溝通</h3>

                    <ul class="space-y-3 text-slate-600">

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> AI 加速新藥開發</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 數位醫療政策佈局</li>

                    </ul>

                </div>


                <!-- 卡片 4 -->

                <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2 border-t-4 border-amber-500 group">

                    <div class="w-16 h-16 rounded-full bg-amber-50 flex items-center justify-center text-amber-500 text-2xl mb-6 group-hover:scale-110 transition-transform">

                        <i class="fa-solid fa-tower-cell"></i>

                    </div>

                    <h3 class="text-xl font-bold text-slate-800 mb-4">遠距與平台</h3>

                    <ul class="space-y-3 text-slate-600">

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 生成式個人化衛教</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 慢性病遠端監控</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 遠距醫療平台營運</li>

                    </ul>

                </div>

            </div>

        </div>

    </section>


    <!-- 解決用戶問題：PDF展示與職能護照區塊 -->

    <section id="pdf-section" class="py-20 bg-white">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">

            <div class="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">

                

                <!-- 左側：文字說明與下載按鈕 -->

                <div>

                    <span class="text-tech-primary font-bold tracking-wider text-sm uppercase">資源下載與驗證</span>

                    <h2 class="text-3xl md:text-4xl font-bold text-slate-800 mt-2 mb-6">數位人才發展職能護照</h2>

                    <p class="text-slate-600 text-lg mb-6 leading-relaxed">

                        結合財團法人資訊工業策進會推動之「醫療資訊」職能護照，我們將學生的學習歷程、跨域專案（如自製聲光動小車、寫字機械手臂等）轉化為數位成就。

                    </p>

                    <p class="text-slate-600 text-lg mb-8 leading-relaxed">

                        打造可信、具稀缺性與應用性的數據經濟，讓您的專業能力成為國際通關的數位名片！

                    </p>

                    

                    <!-- 這裡示範如何正確連結 PDF -->

                    <div class="bg-slate-50 p-6 rounded-xl border border-slate-200 mb-8">

                        <h4 class="font-bold text-slate-800 mb-3"><i class="fa-solid fa-lightbulb text-amber-500 mr-2"></i>網頁設計小知識：如何顯示 PDF？</h4>

                        <p class="text-sm text-slate-600 mb-4">若要在網頁中提供 PDF 供人檢視，我們通常會使用按鈕連結至檔案，或使用內嵌標籤（如下方的展示區塊）。</p>

                        <div class="flex flex-wrap gap-4">

                            <!-- 示範下載/開啟 PDF 的按鈕 -->

                            <a href="#" onclick="alert('這是一個示範按鈕。實務上請將 href 替換為您的 PDF 檔案路徑，例如：/files/passport.pdf'); return false;" class="inline-flex items-center px-5 py-2.5 rounded-lg bg-slate-800 text-white hover:bg-tech-primary transition-colors text-sm font-medium">

                                <i class="fa-solid fa-external-link-alt mr-2"></i>在新分頁開啟 PDF

                            </a>

                            <a href="#" class="inline-flex items-center px-5 py-2.5 rounded-lg border border-slate-300 text-slate-700 hover:bg-slate-100 transition-colors text-sm font-medium">

                                <i class="fa-solid fa-download mr-2"></i>下載 2026 白皮書

                            </a>

                        </div>

                    </div>

                </div>


                <!-- 右側：模擬 PDF 內嵌檢視器 (使用 iframe) -->

                <div class="relative">

                    <!-- 裝飾用背景框 -->

                    <div class="absolute -inset-4 bg-gradient-to-r from-tech-primary/20 to-health-primary/20 rounded-2xl transform rotate-2"></div>

                    

                    <div class="relative bg-white rounded-xl shadow-2xl overflow-hidden border border-slate-200 flex flex-col h-[500px]">

                        <!-- 模擬瀏覽器/PDF閱讀器標題列 -->

                        <div class="bg-slate-100 px-4 py-3 border-b border-slate-200 flex items-center justify-between">

                            <div class="flex space-x-2">

                                <div class="w-3 h-3 rounded-full bg-red-400"></div>

                                <div class="w-3 h-3 rounded-full bg-amber-400"></div>

                                <div class="w-3 h-3 rounded-full bg-green-400"></div>

                            </div>

                            <div class="text-xs font-medium text-slate-500 flex-1 text-center font-mono">

                                數位人才發展職能護照-醫療資訊.pdf

                            </div>

                        </div>

                        

                        <!-- 這是實務上嵌入 PDF 的 HTML 語法示範 

                             因為目前沒有真實的 URL，這裡放一張示意圖片與文字說明 -->

                        <div class="flex-1 bg-slate-50 flex items-center justify-center p-8 relative overflow-hidden">

                            <!-- 實務作法：<iframe src="您的PDF路徑.pdf" class="w-full h-full border-0"></iframe> -->

                            

                            <!-- 示意內容 -->

                            <div class="text-center z-10">

                                <i class="fa-regular fa-file-pdf text-6xl text-slate-300 mb-4"></i>

                                <h3 class="text-xl font-bold text-slate-700 mb-2">PDF 檢視器載入區塊</h3>

                                <p class="text-slate-500 text-sm max-w-xs mx-auto mb-4">

                                    此處為 &lt;iframe&gt; 標籤的預留位置。<br>只要將 PDF 檔案上傳至伺服器並在此填入路徑，即可直接於網頁中預覽。

                                </p>

                                <div class="text-left bg-white p-4 rounded border border-slate-200 shadow-sm inline-block text-xs font-mono text-slate-600">

                                    &lt;iframe <br>

                                    &nbsp;&nbsp;src="passport.pdf"<br>

                                    &nbsp;&nbsp;width="100%" <br>

                                    &nbsp;&nbsp;height="100%"&gt;<br>

                                    &lt;/iframe&gt;

                                </div>

                            </div>

                            

                            <!-- 浮水印裝飾 -->

                            <i class="fa-solid fa-shield-halved absolute -right-10 -bottom-10 text-[200px] text-slate-100 -rotate-12"></i>

                        </div>

                    </div>

                </div>


            </div>

        </div>

    </section>


    <!-- 永續發展 SDGs 區塊 -->

    <section class="py-20 bg-slate-900 text-white relative overflow-hidden">

        <div class="absolute inset-0 opacity-10" style="background-image: radial-gradient(circle at center, #10B981 0, transparent 50%); background-size: 100% 100%;"></div>

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10 text-center">

            <h2 class="text-3xl md:text-4xl font-bold mb-8">「真正的健康管理人才，必須是永續發展的實踐者。」</h2>

            <div class="flex flex-wrap justify-center items-center gap-8 md:gap-16 mt-12">

                <div class="flex flex-col items-center">

                    <div class="w-20 h-20 rounded-2xl bg-health-primary text-white flex items-center justify-center text-3xl font-bold mb-4 shadow-[0_0_15px_rgba(16,185,129,0.5)]">

                        3

                    </div>

                    <h4 class="font-medium text-lg">良好健康與福祉</h4>

                </div>

                <div class="text-slate-500 text-2xl hidden md:block"><i class="fa-solid fa-plus"></i></div>

                <div class="flex flex-col items-center">

                    <div class="w-20 h-20 rounded-2xl bg-pink-500 text-white flex items-center justify-center text-3xl font-bold mb-4 shadow-[0_0_15px_rgba(236,72,153,0.5)]">

                        10

                    </div>

                    <h4 class="font-medium text-lg">減少不平等</h4>

                </div>

            </div>

            <p class="mt-8 text-slate-400 text-lg">推動全民健康福祉，縮短偏鄉醫療不平等。</p>

        </div>

    </section>


    <!-- 頁尾 Footer -->

    <footer class="bg-slate-950 text-slate-400 py-12 border-t border-slate-800">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 grid grid-cols-1 md:grid-cols-3 gap-8">

            <div>

                <div class="flex items-center gap-2 mb-4 text-white">

                    <i class="fa-solid fa-staff-snake text-tech-primary text-xl"></i>

                    <span class="text-xl font-bold tracking-wider">開南大學 健管系</span>

                </div>

                <p class="text-sm mb-4">培育結合醫療資訊、人工智慧與營運管理的跨領域大健康產業人才。</p>

            </div>

            <div>

                <h4 class="text-white font-bold mb-4">快速連結</h4>

                <ul class="space-y-2 text-sm">

                    <li><a href="#" class="hover:text-tech-primary transition-colors">最新消息公告</a></li>

                    <li><a href="#" class="hover:text-tech-primary transition-colors">課程規劃與地圖</a></li>

                    <li><a href="#" class="hover:text-tech-primary transition-colors">招生資訊 (AI元年專案)</a></li>

                </ul>

            </div>

            <div>

                <h4 class="text-white font-bold mb-4">聯絡我們</h4>

                <ul class="space-y-2 text-sm">

                    <li><i class="fa-solid fa-location-dot w-5 text-center mr-2"></i> 桃園市蘆竹區開南路1號</li>

                    <li><i class="fa-solid fa-phone w-5 text-center mr-2"></i> (03) 341-2500 分機 xxxx</li>

                    <li><i class="fa-solid fa-envelope w-5 text-center mr-2"></i> dha@mail.knu.edu.tw</li>

                </ul>

            </div>

        </div>

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 mt-12 pt-8 border-t border-slate-800 text-sm text-center">

            &copy; 2026 開南大學 健康產業管理學系. All rights reserved. 

        </div>

    </footer>


    <!-- 簡單的導覽列滾動效果 JS -->

    <script>

        window.addEventListener('scroll', function() {

            const navbar = document.getElementById('navbar');

            if (window.scrollY > 20) {

                navbar.classList.add('shadow-md');

                navbar.classList.replace('glass-card-light', 'bg-white/95');

            } else {

                navbar.classList.remove('shadow-md');

                navbar.classList.replace('bg-white/95', 'glass-card-light');

            }

        });

    </script>

</body>

</html>

此語法讓一個東西飄來飄去


<!DOCTYPE html>

<html lang="zh-TW">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>開南大學 健康產業管理學系 | AI元年 世代領航</title>

    <!-- 引入 Tailwind CSS 進行快速、現代化的排版與樣式設計 -->

    <script src="https://cdn.tailwindcss.com"></script>

    <!-- 引入 FontAwesome 獲得科技與醫療圖示 -->

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

    <!-- Google Fonts: Noto Sans TC -->

    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700;900&display=swap" rel="stylesheet">

    

    <script>

        // 設定 Tailwind 自訂色彩主題

        tailwind.config = {

            theme: {

                extend: {

                    fontFamily: {

                        sans: ['"Noto Sans TC"', 'sans-serif'],

                    },

                    colors: {

                        tech: {

                            dark: '#0B1120',    // 深邃科技藍

                            primary: '#0EA5E9', // 科技青

                            accent: '#38BDF8',  // 發光亮藍

                        },

                        health: {

                            primary: '#10B981', // 醫療綠

                            light: '#D1FAE5',   // 淺綠背景

                        }

                    },

                    animation: {

                        'gradient-x': 'gradient-x 15s ease infinite',

                        'float': 'float 3s ease-in-out infinite',

                    },

                    keyframes: {

                        'gradient-x': {

                            '0%, 100%': {

                                'background-size': '200% 200%',

                                'background-position': 'left center'

                            },

                            '50%': {

                                'background-size': '200% 200%',

                                'background-position': 'right center'

                            },

                        },

                        'float': {

                            '0%, 100%': { transform: 'translateY(0)' },

                            '50%': { transform: 'translateY(-10px)' },

                        }

                    }

                }

            }

        }

    </script>

    <style>

        /* 玻璃擬態 (Glassmorphism) 特效 */

        .glass-card {

            background: rgba(255, 255, 255, 0.05);

            backdrop-filter: blur(10px);

            -webkit-backdrop-filter: blur(10px);

            border: 1px solid rgba(255, 255, 255, 0.1);

            box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

        }

        

        .glass-card-light {

            background: rgba(255, 255, 255, 0.9);

            backdrop-filter: blur(10px);

            border: 1px solid rgba(255, 255, 255, 0.5);

            box-shadow: 0 8px 32px rgba(31, 38, 135, 0.07);

        }


        /* 漸層文字特效 */

        .text-gradient {

            background: linear-gradient(to right, #38BDF8, #10B981);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

        }


        /* 隱藏滾動條但保留功能 */

        ::-webkit-scrollbar {

            width: 8px;

        }

        ::-webkit-scrollbar-track {

            background: #f1f1f1; 

        }

        ::-webkit-scrollbar-thumb {

            background: #888; 

            border-radius: 4px;

        }

        ::-webkit-scrollbar-thumb:hover {

            background: #555; 

        }

    </style>

</head>

<body class="font-sans antialiased text-gray-800 bg-slate-50 selection:bg-tech-primary selection:text-white">


    <!-- 導覽列 Navbar (將 fixed 改為 absolute，使其固定在頂部不隨螢幕滾動) -->

    <nav class="absolute w-full z-50 transition-all duration-300 glass-card-light" id="navbar">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">

            <div class="flex justify-between items-center h-20">

                <!-- Logo 區域 -->

                <div class="flex-shrink-0 flex items-center gap-3 cursor-pointer">

                    <!-- 使用 FontAwesome 醫療十字與科技網路的意象 -->

                    <div class="w-10 h-10 rounded-lg bg-gradient-to-br from-tech-primary to-health-primary flex items-center justify-center text-white text-xl shadow-lg shadow-tech-primary/30">

                        <i class="fa-solid fa-staff-snake"></i>

                    </div>

                    <div>

                        <h1 class="text-xl font-bold tracking-wider text-slate-800 leading-tight">開南大學</h1>

                        <h2 class="text-sm font-semibold text-tech-primary tracking-widest">健康產業管理學系</h2>

                    </div>

                </div>

                

                <!-- 桌面版選單 -->

                <div class="hidden md:flex space-x-8 items-center">

                    <a href="#" class="text-slate-600 hover:text-tech-primary font-medium transition-colors">最新消息</a>

                    <a href="#" class="text-slate-600 hover:text-tech-primary font-medium transition-colors">系所簡介</a>

                    <a href="#" class="text-slate-600 hover:text-tech-primary font-medium transition-colors">師資陣容</a>

                    <a href="#ai-vision" class="text-slate-600 hover:text-tech-primary font-medium transition-colors">AI 發展願景</a>

                    <a href="#pdf-section" class="px-5 py-2 rounded-full bg-tech-dark text-white font-medium hover:bg-slate-800 transition-all shadow-md hover:shadow-lg transform hover:-translate-y-0.5"><i class="fa-solid fa-passport mr-2"></i>數位職能護照</a>

                </div>


                <!-- 手機版選單按鈕 -->

            <div class="md:hidden flex items-center">

                <button class="text-slate-600 hover:text-tech-primary focus:outline-none">

                    <i class="fa-solid fa-bars text-2xl"></i>

                </button>

            </div>

        </div>

    </div>

</nav>


<!-- 英雄區塊 Hero Section (結合科技感與健康感) -->

<!-- 漸層背景：從深藍到醫療綠，移除動態漸層效果(animate-gradient-x)以保持視覺穩定 -->

<section class="relative pt-32 pb-20 lg:pt-48 lg:pb-32 overflow-hidden bg-gradient-to-br from-slate-900 via-tech-dark to-teal-900">

    <!-- 裝飾性背景元素 -->

    <div class="absolute top-0 left-0 w-full h-full overflow-hidden opacity-20 pointer-events-none">

            <div class="absolute -top-24 -left-24 w-96 h-96 rounded-full bg-tech-primary blur-3xl mix-blend-screen"></div>

            <div class="absolute top-1/2 right-12 w-80 h-80 rounded-full bg-health-primary blur-3xl mix-blend-screen"></div>

            <!-- 模擬網格紋理 -->

            <div class="absolute inset-0" style="background-image: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px); background-size: 30px 30px;"></div>

        </div>


        <div class="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 z-10">

        <div class="text-center max-w-4xl mx-auto">

            <!-- 移除 animate-float 特效，讓標籤保持靜止 -->

            <span class="inline-block py-1 px-3 rounded-full bg-white/10 text-health-light border border-white/20 backdrop-blur-md text-sm font-semibold tracking-widest mb-6">

                <i class="fa-solid fa-microchip mr-2"></i>史上最大的典範轉移

            </span>

            <h1 class="text-4xl md:text-6xl font-black text-white mb-6 leading-tight">

                健康產業管理學系 <br>

                    <span class="text-gradient">AI 元年 2026</span>

                </h1>

                <p class="text-lg md:text-xl text-slate-300 mb-10 font-light leading-relaxed">

                    不只是時間節點，而是教育樣貌的全面重塑。<br>

                    以人工智慧為核心驅動力，我們拒絕只當觀眾，必須成為創造者，<br>

                    <span class="font-medium text-white">培育次世代健康革命領導者！</span>

                </p>

                <div class="flex flex-col sm:flex-row justify-center gap-4">

                    <a href="#ai-vision" class="px-8 py-4 rounded-lg bg-health-primary text-white font-bold text-lg hover:bg-emerald-400 transition-all shadow-[0_0_20px_rgba(16,185,129,0.4)] hover:shadow-[0_0_30px_rgba(16,185,129,0.6)] flex items-center justify-center">

                        探索 AI 交匯點 <i class="fa-solid fa-arrow-right ml-2"></i>

                    </a>

                    <a href="#pdf-section" class="px-8 py-4 rounded-lg glass-card text-white font-bold text-lg hover:bg-white/10 transition-all flex items-center justify-center border border-white/30">

                        <i class="fa-regular fa-file-pdf mr-2"></i> 檢視發展白皮書

                    </a>

                </div>

            </div>

            

            <!-- 數據條 -->

            <div class="mt-20 grid grid-cols-1 md:grid-cols-3 gap-6 text-center divide-y md:divide-y-0 md:divide-x divide-white/20 glass-card rounded-2xl p-8">

                <div class="p-4">

                    <h3 class="text-4xl font-black text-white mb-2">1,880億<span class="text-xl font-medium text-slate-400 ml-1">美元</span></h3>

                    <p class="text-tech-accent font-medium">2030年 AI 健康照護市場</p>

                </div>

                <div class="p-4">

                    <h3 class="text-4xl font-black text-white mb-2">37%</h3>

                    <p class="text-tech-accent font-medium">年複合成長率(CAGR) 高爆發</p>

                </div>

                <div class="p-4">

                    <h3 class="text-4xl font-black text-white mb-2">SDG 3 & 10</h3>

                    <p class="text-tech-accent font-medium">推動全民健康福祉與平權</p>

                </div>

            </div>

        </div>

    </section>


    <!-- AI 願景區塊 (卡片式佈局) -->

    <section id="ai-vision" class="py-24 bg-slate-50 relative">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">

            <div class="text-center mb-16">

                <h2 class="text-3xl md:text-4xl font-bold text-slate-800 mb-4">AI × 健康管理：無限可能的交匯點</h2>

                <div class="w-24 h-1 bg-gradient-to-r from-tech-primary to-health-primary mx-auto rounded-full mb-6"></div>

                <p class="text-slate-600 max-w-2xl mx-auto text-lg">

                    從單純的「AI 使用者」進化為「AI 醫療創新管理者」。我們的課程與實作涵蓋四大核心領域：

                </p>

            </div>


            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">

                <!-- 卡片 1 -->

                <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2 border-t-4 border-tech-primary group">

                    <div class="w-16 h-16 rounded-full bg-blue-50 flex items-center justify-center text-tech-primary text-2xl mb-6 group-hover:scale-110 transition-transform">

                        <i class="fa-solid fa-stethoscope"></i>

                    </div>

                    <h3 class="text-xl font-bold text-slate-800 mb-4">臨床與照護</h3>

                    <ul class="space-y-3 text-slate-600">

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> AI 輔助影像判讀</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 穿戴預測分析</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 防跌陪伴機器人</li>

                    </ul>

                </div>


                <!-- 卡片 2 -->

                <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2 border-t-4 border-health-primary group">

                    <div class="w-16 h-16 rounded-full bg-green-50 flex items-center justify-center text-health-primary text-2xl mb-6 group-hover:scale-110 transition-transform">

                        <i class="fa-solid fa-database"></i>

                    </div>

                    <h3 class="text-xl font-bold text-slate-800 mb-4">營運與大數據</h3>

                    <ul class="space-y-3 text-slate-600">

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 醫院排程最佳化</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 疾病風險預測</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 智慧醫材供應鏈</li>

                    </ul>

                </div>


                <!-- 卡片 3 -->

                <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2 border-t-4 border-purple-500 group">

                    <div class="w-16 h-16 rounded-full bg-purple-50 flex items-center justify-center text-purple-500 text-2xl mb-6 group-hover:scale-110 transition-transform">

                        <i class="fa-solid fa-flask"></i>

                    </div>

                    <h3 class="text-xl font-bold text-slate-800 mb-4">研發與溝通</h3>

                    <ul class="space-y-3 text-slate-600">

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> AI 加速新藥開發</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 數位醫療政策佈局</li>

                    </ul>

                </div>


                <!-- 卡片 4 -->

                <div class="bg-white rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 transform hover:-translate-y-2 border-t-4 border-amber-500 group">

                    <div class="w-16 h-16 rounded-full bg-amber-50 flex items-center justify-center text-amber-500 text-2xl mb-6 group-hover:scale-110 transition-transform">

                        <i class="fa-solid fa-tower-cell"></i>

                    </div>

                    <h3 class="text-xl font-bold text-slate-800 mb-4">遠距與平台</h3>

                    <ul class="space-y-3 text-slate-600">

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 生成式個人化衛教</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 慢性病遠端監控</li>

                        <li class="flex items-start"><i class="fa-solid fa-check text-health-primary mt-1 mr-2"></i> 遠距醫療平台營運</li>

                    </ul>

                </div>

            </div>

        </div>

    </section>


    <!-- 解決用戶問題：PDF展示與職能護照區塊 -->

    <section id="pdf-section" class="py-20 bg-white">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">

            <div class="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">

                

                <!-- 左側：文字說明與下載按鈕 -->

                <div>

                    <span class="text-tech-primary font-bold tracking-wider text-sm uppercase">資源下載與驗證</span>

                    <h2 class="text-3xl md:text-4xl font-bold text-slate-800 mt-2 mb-6">數位人才發展職能護照</h2>

                    <p class="text-slate-600 text-lg mb-6 leading-relaxed">

                        結合財團法人資訊工業策進會推動之「醫療資訊」職能護照，我們將學生的學習歷程、跨域專案（如自製聲光動小車、寫字機械手臂等）轉化為數位成就。

                    </p>

                    <p class="text-slate-600 text-lg mb-8 leading-relaxed">

                        打造可信、具稀缺性與應用性的數據經濟，讓您的專業能力成為國際通關的數位名片！

                    </p>

                    

                    <!-- 這裡示範如何正確連結 PDF -->

                    <div class="bg-slate-50 p-6 rounded-xl border border-slate-200 mb-8">

                        <h4 class="font-bold text-slate-800 mb-3"><i class="fa-solid fa-lightbulb text-amber-500 mr-2"></i>網頁設計小知識：如何顯示 PDF？</h4>

                        <p class="text-sm text-slate-600 mb-4">若要在網頁中提供 PDF 供人檢視，我們通常會使用按鈕連結至檔案，或使用內嵌標籤（如下方的展示區塊）。</p>

                        <div class="flex flex-wrap gap-4">

                            <!-- 示範下載/開啟 PDF 的按鈕 -->

                            <a href="#" onclick="alert('這是一個示範按鈕。實務上請將 href 替換為您的 PDF 檔案路徑，例如：/files/passport.pdf'); return false;" class="inline-flex items-center px-5 py-2.5 rounded-lg bg-slate-800 text-white hover:bg-tech-primary transition-colors text-sm font-medium">

                                <i class="fa-solid fa-external-link-alt mr-2"></i>在新分頁開啟 PDF

                            </a>

                            <a href="#" class="inline-flex items-center px-5 py-2.5 rounded-lg border border-slate-300 text-slate-700 hover:bg-slate-100 transition-colors text-sm font-medium">

                                <i class="fa-solid fa-download mr-2"></i>下載 2026 白皮書

                            </a>

                        </div>

                    </div>

                </div>


                <!-- 右側：模擬 PDF 內嵌檢視器 (使用 iframe) -->

                <div class="relative">

                    <!-- 裝飾用背景框 -->

                    <div class="absolute -inset-4 bg-gradient-to-r from-tech-primary/20 to-health-primary/20 rounded-2xl transform rotate-2"></div>

                    

                    <div class="relative bg-white rounded-xl shadow-2xl overflow-hidden border border-slate-200 flex flex-col h-[500px]">

                        <!-- 模擬瀏覽器/PDF閱讀器標題列 -->

                        <div class="bg-slate-100 px-4 py-3 border-b border-slate-200 flex items-center justify-between">

                            <div class="flex space-x-2">

                                <div class="w-3 h-3 rounded-full bg-red-400"></div>

                                <div class="w-3 h-3 rounded-full bg-amber-400"></div>

                                <div class="w-3 h-3 rounded-full bg-green-400"></div>

                            </div>

                            <div class="text-xs font-medium text-slate-500 flex-1 text-center font-mono">

                                數位人才發展職能護照-醫療資訊.pdf

                            </div>

                        </div>

                        

                        <!-- 這是實務上嵌入 PDF 的 HTML 語法示範 

                             因為目前沒有真實的 URL，這裡放一張示意圖片與文字說明 -->

                        <div class="flex-1 bg-slate-50 flex items-center justify-center p-8 relative overflow-hidden">

                            <!-- 實務作法：<iframe src="您的PDF路徑.pdf" class="w-full h-full border-0"></iframe> -->

                            

                            <!-- 示意內容 -->

                            <div class="text-center z-10">

                                <i class="fa-regular fa-file-pdf text-6xl text-slate-300 mb-4"></i>

                                <h3 class="text-xl font-bold text-slate-700 mb-2">PDF 檢視器載入區塊</h3>

                                <p class="text-slate-500 text-sm max-w-xs mx-auto mb-4">

                                    此處為 &lt;iframe&gt; 標籤的預留位置。<br>只要將 PDF 檔案上傳至伺服器並在此填入路徑，即可直接於網頁中預覽。

                                </p>

                                <div class="text-left bg-white p-4 rounded border border-slate-200 shadow-sm inline-block text-xs font-mono text-slate-600">

                                    &lt;iframe <br>

                                    &nbsp;&nbsp;src="passport.pdf"<br>

                                    &nbsp;&nbsp;width="100%" <br>

                                    &nbsp;&nbsp;height="100%"&gt;<br>

                                    &lt;/iframe&gt;

                                </div>

                            </div>

                            

                            <!-- 浮水印裝飾 -->

                            <i class="fa-solid fa-shield-halved absolute -right-10 -bottom-10 text-[200px] text-slate-100 -rotate-12"></i>

                        </div>

                    </div>

                </div>


            </div>

        </div>

    </section>


    <!-- 永續發展 SDGs 區塊 -->

    <section class="py-20 bg-slate-900 text-white relative overflow-hidden">

        <div class="absolute inset-0 opacity-10" style="background-image: radial-gradient(circle at center, #10B981 0, transparent 50%); background-size: 100% 100%;"></div>

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10 text-center">

            <h2 class="text-3xl md:text-4xl font-bold mb-8">「真正的健康管理人才，必須是永續發展的實踐者。」</h2>

            <div class="flex flex-wrap justify-center items-center gap-8 md:gap-16 mt-12">

                <div class="flex flex-col items-center">

                    <div class="w-20 h-20 rounded-2xl bg-health-primary text-white flex items-center justify-center text-3xl font-bold mb-4 shadow-[0_0_15px_rgba(16,185,129,0.5)]">

                        3

                    </div>

                    <h4 class="font-medium text-lg">良好健康與福祉</h4>

                </div>

                <div class="text-slate-500 text-2xl hidden md:block"><i class="fa-solid fa-plus"></i></div>

                <div class="flex flex-col items-center">

                    <div class="w-20 h-20 rounded-2xl bg-pink-500 text-white flex items-center justify-center text-3xl font-bold mb-4 shadow-[0_0_15px_rgba(236,72,153,0.5)]">

                        10

                    </div>

                    <h4 class="font-medium text-lg">減少不平等</h4>

                </div>

            </div>

            <p class="mt-8 text-slate-400 text-lg">推動全民健康福祉，縮短偏鄉醫療不平等。</p>

        </div>

    </section>


    <!-- 頁尾 Footer -->

    <footer class="bg-slate-950 text-slate-400 py-12 border-t border-slate-800">

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 grid grid-cols-1 md:grid-cols-3 gap-8">

            <div>

                <div class="flex items-center gap-2 mb-4 text-white">

                    <i class="fa-solid fa-staff-snake text-tech-primary text-xl"></i>

                    <span class="text-xl font-bold tracking-wider">開南大學 健管系</span>

                </div>

                <p class="text-sm mb-4">培育結合醫療資訊、人工智慧與營運管理的跨領域大健康產業人才。</p>

            </div>

            <div>

                <h4 class="text-white font-bold mb-4">快速連結</h4>

                <ul class="space-y-2 text-sm">

                    <li><a href="#" class="hover:text-tech-primary transition-colors">最新消息公告</a></li>

                    <li><a href="#" class="hover:text-tech-primary transition-colors">課程規劃與地圖</a></li>

                    <li><a href="#" class="hover:text-tech-primary transition-colors">招生資訊 (AI元年專案)</a></li>

                </ul>

            </div>

            <div>

                <h4 class="text-white font-bold mb-4">聯絡我們</h4>

                <ul class="space-y-2 text-sm">

                    <li><i class="fa-solid fa-location-dot w-5 text-center mr-2"></i> 桃園市蘆竹區開南路1號</li>

                    <li><i class="fa-solid fa-phone w-5 text-center mr-2"></i> (03) 341-2500 分機 xxxx</li>

                    <li><i class="fa-solid fa-envelope w-5 text-center mr-2"></i> dha@mail.knu.edu.tw</li>

                </ul>

            </div>

        </div>

        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 mt-12 pt-8 border-t border-slate-800 text-sm text-center">

            &copy; 2026 開南大學 健康產業管理學系. All rights reserved. 

        </div>

    </footer>


    <!-- 簡單的導覽列滾動效果 JS -->

    <script>

        window.addEventListener('scroll', function() {

            const navbar = document.getElementById('navbar');

            if (window.scrollY > 20) {

                navbar.classList.add('shadow-md');

                navbar.classList.replace('glass-card-light', 'bg-white/95');

            } else {

                navbar.classList.remove('shadow-md');

                navbar.classList.replace('bg-white/95', 'glass-card-light');

            }

        });

    </script>

</body>

</html>


這個不會跑來跑去!!!



第一次接觸這網站，用起來不習慣!


https://dha.knu.edu.tw/p/406-1042-56401,r11.php?Lang=zh-tw


大致上沒有問題，實際上還有些問題

就是要把PDF像投影幕一樣，不用下載


- 沒有留言:

obs直播錄影 [電腦小筆記]

 2026.03.30 線上會議發生自己有個問題











串流 --> 直播

錄影 --> 一般的

我昨天(2026.03.30)忘記把內建聲音打開，因此老師的聲音沒錄製到，是回看才注意到這一塊





心得：變成我下次錄影時候，除了檢查我自己的，還要檢查對方的聲音（也就是筆電內建的）

- 沒有留言:

2026年3月25日 星期三

2026.03.25 照度計

- 沒有留言:

2026年3月23日 星期一

2026.03.24 Scan and fill in the form

我是保健營養系學生戴育正，請您填寫「飲水量（純水）與飲料量調查」表單，感謝您。另外，請您挑選適合的語言，或自行翻譯。

I am Yu-Cheng Tai, a student in the Department of Health and Nutrition. Please fill out the "Water and Beverage Intake Survey" form. Thank you! Additionally, please select a suitable language or translate it yourself.

保健栄養学科の学生、戴育正です。「飲水量（純水）と飲料摂取量に関する調査」フォームへのご記入をお願いいたします 。ありがとうございます。また、適した言語をお選びいただくか、ご自身で翻訳機能をご利用ください

Tôi là Đới Dục Chính, sinh viên Khoa Dinh dưỡng và Sức khỏe. Mời bạn điền thông tin vào biểu mẫu "Khảo sát về lượng nước uống (nước tinh khiết) và lượng đồ uống", cảm ơn bạn. Ngoài ra, vui lòng chọn ngôn ngữ phù hợp hoặc tự dịch.

Saya Yu-Cheng Tai, mahasiswa Departemen Kesehatan dan Gizi. Anda dipersilakan untuk mengisi formulir ini "Survei Konsumsi Air Minum (Air Putih) dan Minuman", terima kasih. Selain itu, silakan pilih bahasa yang sesuai atau terjemahkan sendir


-------------------------------------------------------------------------------------------------------------------------

您好，這是中文版本的。

請點括號裡的連結：（https://forms.gle/VeMcxp7PjgjFjZfv5）

 研究主題：學生每日飲水量調查 (含開水、咖啡、奶茶等所有飲品)

執行者： 保健營養學系學生 戴育正 (指導：江易原老師、陳玉蘭營養師)

用途： 營養相關年會壁報論文發表

隱私： 僅需填寫「學號、國籍、飲水量」，資料僅供學術研究，請放心填寫。

----------------------------------------------------------------------------------------------------------------------









Hello, This is English version.


Click here: " https://forms.gle/g4iNDwH28BvghpMY8 "

Topic: Student Daily Fluid Intake Survey

Hello! We are the Health & Nutrition Research Team "Prof. I-Yuan Chiang (One dollar), Dietitian Yu-Lan Chen, and a student Jerry Tai."

Goal: To compare daily water and beverage intake among local and international students with WHO standards.

Outcome: Findings will be presented at a nutrition conference.

Privacy: Anonymous survey. Only Student ID and Nationality are required.

Note for internationalʼStudents: Please report your average intake since arriving in Taiwan.

Thank you for your help!

-----------------------------------------------------------------------------------------------------------------------------






こんにちは。こちらは日本語版のアンケートです。

ここをクリックしてください: "https://forms.gle/uEfMgZiJ3fihS2Pm8"

項目：学生の水分摂取量調査（純水 vs 飲料）

こんにちは！**保健栄養学科研究チーム（江教授、陳栄養士、戴学生）**です。

目的：台湾人学生と留学生の1日の総水分摂取量を調査し、WHOの基準と比較します。

用途：研究成果は栄養学会で発表予定です。

プライバシー：学籍番号と国籍のみ。個人情報は厳守します。

留学生の方へ：台湾に来てからの平均摂取量を回答してください。

ご協力ありがとうございます！
--------------------------------------------------------------------------------






Xin chào, đây là phiên bản tiếng Việt.

Vui lòng bấm vào đây: "https://forms.gle/Tu2613TTo96p6g3o8"

Chào bạn! Chúng tôi là Nhóm nghiên cứu Khoa Dinh dưỡng Sức khỏe (GV. Giang Ích Nguyên, Chuyên gia dinh dưỡng Trần Ngọc Lan và SV. Đới Dục Chính).

Mục đích: Tìm hiểu tổng lượng nước uống hàng ngày (nước lọc và đồ uống) để so sánh với tiêu chuẩn WHO.

Sử dụng: Kết quả sẽ được trình bày tại hội nghị dinh dưỡng.

Bảo mật: Chỉ cần Mã SV và Quốc tịch, không thu thập thông tin cá nhân khác.

Lưu ý cho SV quốc tế: Hãy điền lượng nước uống trung bình sau khi đến Đài Loan.

Chúc bạn sức khỏe!


-----------------------------------------------------------------------------------------------------------------------------











Halo, ini adalah versi bahasa Indonesia.


Silakan klik di sini: "https://forms.gle/F34tkbLZqQq7XnqX6"

Halo! Kami adalah Tim Peneliti Gizi dan Kesehatan (Prof. I-Yuan Chiang, Ahli Gizi Yu-Lan Chen, dan Jerry Tai).

Tujuan: Mengetahui total asupan cairan harian mahasiswa lokal & internasional untuk dibandingkan dengan standar WHO.

Kegunaan: Hasil riset akan dipresentasikan pada konferensi gizi.

Privasi: Aman & Anonim. Hanya perlu NIM dan Kewarganegaraan.

Catatan Mhs Internasional: Mohon isi rata-rata asupan Anda selama di Taiwan.

Terima kasih atas bantuan Anda!

--------------------------------------------------------------------------------------------------------------------------- 



- 沒有留言:
訂閱： 文章 (Atom)

2026.06.08 Please ANS the Survey

Link:  https://forms.gle/paNGp6GbSTD9p3kD8

  • 2026.03.24 Scan and fill in the form
    我是保健營養系學生戴育正，請您填寫「飲水量（純水）與飲料量調查」表單，感謝您。另外，請您挑選適合的語言，或自行翻譯。 I am Yu-Cheng Tai, a student in the Department of Health and Nutrition. Please fi...
  • 大一普通化學筆記 Chemical Notes of University (2025.09.30～2025.11.04)
    Fall 2025 2025.09.30 老師今天帶來的器材如圖所示： 減鈉含碘鹽成分： 氯化鉀、檸檬酸鈉、碳酸鎂、碘酸鉀 氟碘鹽成分： 鹽、氟化鈉、碘酸鉀 香蕉： 含有鉀的部分 圖片來源      https://consumer.fda.gov.tw/Food/tfndDet...
  • 食品檢驗丙級檢定 Level C Food Inspection and Analysis No.1
    2025.09.25開始 ，Jerry（育正）大一下定決心要參加丙級檢定，每天的進度表如下： https://docs.google.com/spreadsheets/d/167tQsLOmuzcKbMDzufr8jAbP4U0XsNW-r1AGPg6sHOA/edit?usp=...