265 lines
17 KiB
HTML
265 lines
17 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
|
||
<meta name="format-detection" content="telephone=no">
|
||
<title>孕期营养影响孩子智商吗?</title>
|
||
<!-- 孕期专题 · 营养与智力(孕期首页「其他妈妈也在搜」第 3 条进入)。
|
||
2026-10-31 按《孕期专题统一设计规范 v2》重做:清新、简洁、核心明确。主色 #F08A24。
|
||
自成一页:不引 app.js;回首页走相对路径 ../../;体重工具 /yunqi-tizhong/ 同源 + 带身份。 -->
|
||
<style>
|
||
:root{--c:#F08A24;--cbg:#FFF3E6;--h:#1F2329;--t:#4E5969;--m:#86909C;--line:#EEF0F3;--soft:#F7F8FA}
|
||
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
|
||
html,body{height:100%;overflow:hidden;background:#fff;color:var(--t);font:15px/1.75 -apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
|
||
#scroll{position:fixed;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:none;padding-bottom:calc(28px + env(safe-area-inset-bottom))}
|
||
img{display:block;max-width:100%}
|
||
button{font:inherit;border:0;background:none;color:inherit;cursor:pointer}
|
||
b,strong{color:var(--h)}
|
||
.ic{width:21px;height:21px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
|
||
|
||
/* 顶栏 */
|
||
.bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:4px;height:48px;padding:0 8px;background:rgba(255,255,255,0);border-bottom:1px solid transparent;transition:background .2s,border-color .2s}
|
||
.bar.on{background:#fff;border-bottom-color:var(--line)}
|
||
.bar .back{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--h)}
|
||
.bar .back .ic{width:22px;height:22px}
|
||
.bar .t{font-weight:600;font-size:16px;color:var(--h)}
|
||
|
||
.wrap{padding:0 20px}
|
||
|
||
/* Hero */
|
||
.hero img{width:100%;height:190px;object-fit:cover;border-radius:20px;background:var(--cbg)}
|
||
h1{margin-top:20px;font-size:26px;font-weight:800;line-height:1.3;color:var(--h)}
|
||
.ans{margin-top:14px;padding:14px 16px;border-radius:14px;background:var(--cbg);border-left:4px solid var(--c);font-size:16px;font-weight:700;line-height:1.65;color:var(--h)}
|
||
|
||
/* 孕周提示条 */
|
||
.me{display:none;margin-top:12px;width:100%;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;border:1px solid var(--line);font-size:13.5px;text-align:left;color:var(--t)}
|
||
.me.on{display:flex}
|
||
.me .ic{color:var(--c);width:20px;height:20px}
|
||
.me b{color:var(--c);margin-right:4px}
|
||
.me span{flex:1;min-width:0}
|
||
|
||
/* 记住这 3 点 */
|
||
.three{margin-top:28px;padding:18px 18px 6px;border-radius:18px;border:1px solid var(--line)}
|
||
.three h2{font-size:18px;font-weight:700;color:var(--h);margin-bottom:6px}
|
||
.pt{display:flex;gap:14px;padding:10px 0 12px}
|
||
.pt+.pt{border-top:1px solid var(--line)}
|
||
.pt .n{flex:none;width:24px;font-size:26px;font-weight:800;line-height:1.1;color:var(--c);font-family:"DIN Alternate","Helvetica Neue",Arial,sans-serif}
|
||
.pt b{display:block;font-size:16px;line-height:1.5}
|
||
.pt small{display:block;font-size:12.5px;color:var(--m);line-height:1.6;margin-top:2px}
|
||
|
||
/* 节 */
|
||
.sec{margin-top:36px}
|
||
.sec h2{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:700;color:var(--h)}
|
||
.sec h2 i{font-style:normal;font-size:13px;font-weight:700;color:var(--c);background:var(--cbg);border-radius:99px;width:22px;height:22px;display:grid;place-items:center}
|
||
.key{margin-top:6px;font-weight:700;color:var(--c)}
|
||
.items{margin-top:12px;border-radius:18px;border:1px solid var(--line);padding:2px 16px}
|
||
.it{display:flex;gap:12px;padding:13px 0}
|
||
.it+.it{border-top:1px solid var(--line)}
|
||
.it .ib{flex:none;width:36px;height:36px;border-radius:12px;background:var(--cbg);color:var(--c);display:grid;place-items:center}
|
||
.it p{flex:1;min-width:0;line-height:1.65}
|
||
.it p b{margin-right:6px}
|
||
.more{margin-top:10px;font-size:13.5px;color:var(--m);padding-left:2px}
|
||
.more b{color:var(--t);font-weight:600}
|
||
.pic{margin-top:14px}
|
||
.pic img{width:100%;height:120px;object-fit:cover;border-radius:18px}
|
||
|
||
/* 阶段表 */
|
||
.tbl{margin-top:12px;border-radius:18px;border:1px solid var(--line);overflow:hidden}
|
||
.tr{display:grid;grid-template-columns:76px 70px 1fr;gap:8px;align-items:center;padding:12px 14px;font-size:14px;line-height:1.55}
|
||
.tr+.tr{border-top:1px solid var(--line)}
|
||
.tr.hd{background:var(--soft);font-size:12.5px;color:var(--m);padding:8px 14px}
|
||
.tr .s b{display:block;font-size:15px}
|
||
.tr .s small{font-size:12px;color:var(--m)}
|
||
.tr .f{font-weight:700;color:var(--c)}
|
||
.tr.hl{background:var(--cbg);box-shadow:inset 3px 0 0 var(--c)}
|
||
|
||
/* 误区 */
|
||
.my{display:flex;gap:12px;padding:13px 0}
|
||
.my+.my{border-top:1px solid var(--line)}
|
||
.my .x{flex:none;width:22px;height:22px;margin-top:2px;color:#C9CDD4}
|
||
.my .q{display:block;font-size:14px;color:var(--m);text-decoration:line-through;text-decoration-color:#C9CDD4}
|
||
.my p{line-height:1.65}
|
||
|
||
/* 体重卡 */
|
||
.wt{margin-top:36px;padding:18px;border-radius:18px;background:var(--soft)}
|
||
.wt .hd{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700;color:var(--h)}
|
||
.wt .hd .ic{color:var(--c)}
|
||
.wt p{margin-top:6px;font-size:14px}
|
||
.btn{margin-top:14px;width:100%;height:46px;border-radius:99px;background:var(--c);color:#fff;font-size:15.5px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px}
|
||
.btn .ic{width:18px;height:18px}
|
||
|
||
/* 来源 + 免责 */
|
||
.src{margin-top:32px;border-top:1px solid var(--line);padding-top:6px}
|
||
.src summary{list-style:none;display:flex;align-items:center;gap:6px;padding:10px 0;font-size:13.5px;color:var(--m);cursor:pointer}
|
||
.src summary::-webkit-details-marker{display:none}
|
||
.src summary .ic{width:18px;height:18px}
|
||
.src summary .ar{margin-left:auto;transition:transform .2s}
|
||
.src[open] summary .ar{transform:rotate(180deg)}
|
||
.src ul{padding:0 0 6px 18px;font-size:12.5px;line-height:1.7;color:var(--m)}
|
||
.src li+li{margin-top:6px}
|
||
.foot{margin-top:10px;font-size:12px;line-height:1.7;color:var(--m)}
|
||
|
||
/* 进场 */
|
||
.fade{opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .45s ease}
|
||
.fade.in{opacity:1;transform:none}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<svg width="0" height="0" style="position:absolute" aria-hidden="true">
|
||
<symbol id="i-back" viewBox="0 0 24 24"><path d="M15 5l-7 7 7 7"/></symbol>
|
||
<symbol id="i-leaf" viewBox="0 0 24 24"><path d="M5 19c0-8 5-13 14-14 0 9-5 14-13 14z"/><path d="M5 19l8-8"/></symbol>
|
||
<symbol id="i-salt" viewBox="0 0 24 24"><path d="M8 9h8l-1 11H9z"/><path d="M8.5 9l1-4.5h5l1 4.5"/><path d="M11 6.5h.01M13 6.5h.01"/></symbol>
|
||
<symbol id="i-fish" viewBox="0 0 24 24"><path d="M3 12c3-4.5 8-6 12-3.5L20 6v12l-5-2.5C11 18 6 16.5 3 12z"/><path d="M8 11.5h.01"/></symbol>
|
||
<symbol id="i-drop" viewBox="0 0 24 24"><path d="M12 3.5c3.5 4.5 6 7.8 6 10.5a6 6 0 0 1-12 0c0-2.7 2.5-6 6-10.5z"/></symbol>
|
||
<symbol id="i-x" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M9 9l6 6M15 9l-6 6"/></symbol>
|
||
<symbol id="i-scale" viewBox="0 0 24 24"><rect x="3.5" y="3.5" width="17" height="17" rx="4"/><path d="M8 9.5a5.5 5.5 0 0 1 8 0M12 9.5l1.2-1.8"/></symbol>
|
||
<symbol id="i-cal" viewBox="0 0 24 24"><rect x="4" y="5" width="16" height="15" rx="3"/><path d="M4 10h16M9 3v4M15 3v4"/></symbol>
|
||
<symbol id="i-arrow" viewBox="0 0 24 24"><path d="M5 12h13M13 6.5l5.5 5.5-5.5 5.5"/></symbol>
|
||
<symbol id="i-book" viewBox="0 0 24 24"><path d="M4 5.5A1.5 1.5 0 0 1 5.5 4H11v16H5.5A1.5 1.5 0 0 1 4 18.5zM20 5.5A1.5 1.5 0 0 0 18.5 4H13v16h5.5a1.5 1.5 0 0 0 1.5-1.5z"/></symbol>
|
||
<symbol id="i-down" viewBox="0 0 24 24"><path d="M6 9l6 6 6-6"/></symbol>
|
||
</svg>
|
||
|
||
<div id="scroll">
|
||
<header class="bar" id="bar">
|
||
<button class="back" id="back" aria-label="返回"><svg class="ic"><use href="#i-back" xlink:href="#i-back"/></svg></button>
|
||
<span class="t">孕期专题</span>
|
||
</header>
|
||
|
||
<main class="wrap">
|
||
<section class="hero">
|
||
<img src="img/hero.webp" alt="孕妈坐在餐桌前,桌上有鱼、青菜、鸡蛋和牛奶">
|
||
<h1>孕期营养<br>影响孩子智商吗?</h1>
|
||
<div class="ans">会影响大脑发育,但关键是别缺,没有吃了变聪明的食物。</div>
|
||
<button class="me" id="me" type="button"><svg class="ic"><use href="#i-cal" xlink:href="#i-cal"/></svg><span><b id="meT"></b><em id="meD" style="font-style:normal"></em></span><svg class="ic" style="color:#C9CDD4;width:16px;height:16px"><use href="#i-arrow" xlink:href="#i-arrow"/></svg></button>
|
||
</section>
|
||
|
||
<section class="three fade">
|
||
<h2>记住这 3 点</h2>
|
||
<div class="pt"><span class="n">1</span><div><b>叶酸每天 0.4mg</b><small>孕前 3 个月开始,至少吃到孕 3 个月</small></div></div>
|
||
<div class="pt"><span class="n">2</span><div><b>炒菜用加碘盐</b><small>缺碘会影响宝宝大脑发育</small></div></div>
|
||
<div class="pt"><span class="n">3</span><div><b>每周 2~3 次鱼</b><small>补 DHA,选刺少、汞低的鱼</small></div></div>
|
||
</section>
|
||
|
||
<section class="sec fade" id="s1">
|
||
<h2><i>1</i>大脑最需要的 4 种营养</h2>
|
||
<p class="key">这 4 样别缺,比任何「补脑品」都管用。</p>
|
||
<div class="items">
|
||
<div class="it"><span class="ib"><svg class="ic"><use href="#i-leaf" xlink:href="#i-leaf"/></svg></span><p><b>叶酸</b>预防神经管缺陷。多吃绿叶菜,再加每天一片叶酸。</p></div>
|
||
<div class="it"><span class="ib"><svg class="ic"><use href="#i-salt" xlink:href="#i-salt"/></svg></span><p><b>碘</b>帮宝宝大脑正常发育。用加碘盐,常吃海带、紫菜。</p></div>
|
||
<div class="it"><span class="ib"><svg class="ic"><use href="#i-fish" xlink:href="#i-fish"/></svg></span><p><b>DHA</b>大脑和视力的原料。主要靠吃鱼,不爱吃鱼再问医生。</p></div>
|
||
<div class="it"><span class="ib"><svg class="ic"><use href="#i-drop" xlink:href="#i-drop"/></svg></span><p><b>铁</b>缺铁贫血,宝宝供氧受影响。吃红肉、动物血,配蔬果。</p></div>
|
||
</div>
|
||
<p class="more"><b>另外:</b>蛋白质、胆碱、维生素 D,靠鸡蛋、奶、晒太阳。</p>
|
||
<div class="pic"><img src="img/foods.webp" alt="鸡蛋、三文鱼、菠菜、紫菜、红肉、牛奶、豆腐" loading="lazy"></div>
|
||
</section>
|
||
|
||
<section class="sec fade" id="s2">
|
||
<h2><i>2</i>孕早中晚期各吃什么</h2>
|
||
<p class="key">孕早期不用多吃,之后每天也只多一点。</p>
|
||
<div class="tbl">
|
||
<div class="tr hd"><span>阶段</span><span>重点</span><span>一句话</span></div>
|
||
<div class="tr" id="stE"><span class="s"><b>孕早期</b><small>1~13 周</small></span><span class="f">叶酸</span><span>吃得下就好,不用加量</span></div>
|
||
<div class="tr" id="stM"><span class="s"><b>孕中期</b><small>14~27 周</small></span><span class="f">奶、肉蛋</span><span>每天多一杯奶、一份肉蛋</span></div>
|
||
<div class="tr" id="stL"><span class="s"><b>孕晚期</b><small>28 周起</small></span><span class="f">铁、DHA</span><span>多吃红肉和鱼,管住体重</span></div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="sec fade" id="s3">
|
||
<h2><i>3</i>3 个误区</h2>
|
||
<p class="key">「补脑」食物和贵价补剂,替代不了均衡饮食。</p>
|
||
<div class="items">
|
||
<div class="my"><svg class="ic x"><use href="#i-x" xlink:href="#i-x"/></svg><div><span class="q">多吃核桃,宝宝更聪明</span><p>形似大脑不等于补脑,一天一小把。</p></div></div>
|
||
<div class="my"><svg class="ic x"><use href="#i-x" xlink:href="#i-x"/></svg><div><span class="q">补剂越贵越好</span><p>看成分含量,几种同吃易超量。</p></div></div>
|
||
<div class="my"><svg class="ic x"><use href="#i-x" xlink:href="#i-x"/></svg><div><span class="q">一人吃,两人补</span><p>孕中晚期每天只多一杯奶、一个蛋的量。</p></div></div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="wt fade">
|
||
<div class="hd"><svg class="ic"><use href="#i-scale" xlink:href="#i-scale"/></svg>体重长得合理,宝宝才长得好</div>
|
||
<p>孕前偏瘦、正常、偏胖,该长的不一样。每周固定时间称一次。</p>
|
||
<button class="btn" id="goWeight" type="button">算算我的增重范围<svg class="ic"><use href="#i-arrow" xlink:href="#i-arrow"/></svg></button>
|
||
</section>
|
||
|
||
<details class="src">
|
||
<summary><svg class="ic"><use href="#i-book" xlink:href="#i-book"/></svg>参考来源<svg class="ic ar"><use href="#i-down" xlink:href="#i-down"/></svg></summary>
|
||
<ul>
|
||
<li>《中国居民膳食指南(2022)》孕期妇女膳食指南:全程补充叶酸、选用碘盐、常吃含铁食物,每周 2~3 次鱼,孕中期起适量增加奶和鱼禽蛋肉,维持适宜增重。</li>
|
||
<li>《中国居民膳食营养素参考摄入量(2023 版)》(中国营养学会):孕期碘、铁、维生素 D、蛋白质、胆碱的推荐量。</li>
|
||
<li>《围受孕期增补叶酸预防神经管缺陷指南(2017)》:无高危因素者孕前 3 个月起每天增补 0.4mg 叶酸,至孕满 3 个月。</li>
|
||
<li>《中国孕产妇及婴幼儿补充 DHA 的专家共识》:可通过每周 2~3 次鱼类获得 DHA。</li>
|
||
<li>WHO recommendations on antenatal care for a positive pregnancy experience(2016):孕期补充铁和叶酸,强调健康饮食与适宜增重。</li>
|
||
<li>WHO:孕期严重缺碘是可预防的儿童智力损伤的重要原因。</li>
|
||
</ul>
|
||
</details>
|
||
<p class="foot">本页为科普参考,不能代替医生诊断。是否需要补充剂、补多少,请咨询产检医生。</p>
|
||
</main>
|
||
</div>
|
||
|
||
<script>
|
||
(function () {
|
||
'use strict';
|
||
var $ = function (s) { return document.querySelector(s); };
|
||
function hp(n) { var h = (location.hash.slice(1) || '') + '&' + (location.search.slice(1) || ''); var m = h.match(new RegExp('(?:^|&)' + n + '=([^&]*)')); return m ? decodeURIComponent(m[1]) : ''; }
|
||
var openid = hp('openid');
|
||
var sc = $('#scroll');
|
||
|
||
/* 返回:从首页点进来就 back;直接打开(分享 / 刷新)就回同目录的首页,身份原样带回 */
|
||
$('#back').addEventListener('click', function () {
|
||
if (document.referrer && document.referrer.indexOf(location.host) >= 0 && history.length > 1) history.back();
|
||
else location.href = '../../' + location.search + location.hash;
|
||
});
|
||
|
||
/* 滚动后顶栏变白底 + 细分割线 */
|
||
var bar = $('#bar');
|
||
sc.addEventListener('scroll', function () { bar.classList.toggle('on', sc.scrollTop > 8); }, { passive: true });
|
||
|
||
function go(id) {
|
||
var el = document.getElementById(id); if (!el) return;
|
||
var top = el.getBoundingClientRect().top - sc.getBoundingClientRect().top + sc.scrollTop - 60;
|
||
sc.scrollTo({ top: top, behavior: 'smooth' });
|
||
}
|
||
|
||
/* 体重管理:同源相对路径,带身份 */
|
||
$('#goWeight').addEventListener('click', function () { location.href = '/yunqi-tizhong/' + location.search + location.hash; });
|
||
|
||
/* 按孕周点亮阶段表对应行 + 一条小提示 */
|
||
function mark(row, t, d) {
|
||
var el = document.getElementById(row); if (el) el.classList.add('hl');
|
||
$('#meT').textContent = t; $('#meD').textContent = d;
|
||
$('#me').onclick = function () { go('s2'); };
|
||
$('#me').classList.add('on');
|
||
}
|
||
if (openid) {
|
||
fetch('/api/mp/public/mama-box/pregnancy?openid=' + encodeURIComponent(openid))
|
||
.then(function (r) { return r.ok ? r.json() : null; })
|
||
.then(function (j) {
|
||
var p = j && j.code === 200 && j.result; if (!p || p.postpartum) return;
|
||
if (p.week != null && !p.empty) {
|
||
var w = p.week;
|
||
if (w < 14) mark('stE', '孕 ' + w + ' 周', '叶酸别断,吃得下就好');
|
||
else if (w < 28) mark('stM', '孕 ' + w + ' 周', '每天多一杯奶、一份肉蛋');
|
||
else mark('stL', '孕 ' + w + ' 周', '补铁、吃鱼,管住体重');
|
||
}
|
||
}).catch(function () {});
|
||
}
|
||
|
||
/* 进场动画(轻) */
|
||
if ('IntersectionObserver' in window) {
|
||
var io = new IntersectionObserver(function (es) { es.forEach(function (e) { if (e.isIntersecting) { e.target.classList.add('in'); io.unobserve(e.target); } }); }, { root: sc, threshold: .1 });
|
||
[].forEach.call(document.querySelectorAll('.fade'), function (el) { io.observe(el); });
|
||
} else [].forEach.call(document.querySelectorAll('.fade'), function (el) { el.classList.add('in'); });
|
||
|
||
/* 禁止下拉回弹:固定外壳 + 容器滚动 + 到顶/到底时拦 touchmove */
|
||
var y0 = 0;
|
||
sc.addEventListener('touchstart', function (e) { y0 = e.touches[0].clientY; }, { passive: true });
|
||
sc.addEventListener('touchmove', function (e) {
|
||
var dy = e.touches[0].clientY - y0;
|
||
if ((sc.scrollTop <= 0 && dy > 0) || (sc.scrollTop + sc.clientHeight >= sc.scrollHeight - 1 && dy < 0)) e.preventDefault();
|
||
}, { passive: false });
|
||
document.addEventListener('touchmove', function (e) { if (!sc.contains(e.target)) e.preventDefault(); }, { passive: false });
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|