557 lines
17 KiB
HTML
557 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.0,maximum-scale=1.0,user-scalable=no">
|
||
<title>鹏宇 · 命盘</title>
|
||
<style>
|
||
*{margin:0;padding:0;box-sizing:border-box}
|
||
body{
|
||
background:#0d0b12;
|
||
color:#d4c9a8;
|
||
font-family:'PingFang SC','Noto Sans SC','Microsoft YaHei',sans-serif;
|
||
min-height:100dvh;
|
||
overflow-x:hidden;
|
||
padding:38px 16px 60px;
|
||
display:flex;flex-direction:column;align-items:center
|
||
}
|
||
.container{max-width:420px;width:100%}
|
||
|
||
/* header */
|
||
.title{
|
||
text-align:center;
|
||
font-size:22px;
|
||
font-weight:600;
|
||
letter-spacing:4px;
|
||
color:#f0e6c5;
|
||
margin-bottom:6px
|
||
}
|
||
.subtitle{
|
||
text-align:center;
|
||
font-size:13px;
|
||
color:#8a7f68;
|
||
letter-spacing:2px;
|
||
margin-bottom:28px
|
||
}
|
||
|
||
/* four pillars */
|
||
.pillars{
|
||
display:flex;
|
||
justify-content:center;
|
||
gap:10px;
|
||
margin-bottom:24px
|
||
}
|
||
.pillar{
|
||
background:linear-gradient(180deg,#1e1927,#13101b);
|
||
border:1px solid #3a2f4a;
|
||
border-radius:10px;
|
||
width:80px;
|
||
text-align:center;
|
||
padding:10px 0 12px;
|
||
position:relative
|
||
}
|
||
.pillar .p-label{
|
||
font-size:12px;
|
||
color:#6a5f7a;
|
||
letter-spacing:2px;
|
||
margin-bottom:4px
|
||
}
|
||
.pillar .gan{
|
||
font-size:32px;
|
||
font-weight:700;
|
||
color:#f0e6c5;
|
||
line-height:1.1
|
||
}
|
||
.pillar .zhi{
|
||
font-size:28px;
|
||
font-weight:600;
|
||
color:#c9b896;
|
||
line-height:1.2;
|
||
margin-top:2px
|
||
}
|
||
.pillar .p-shen{
|
||
font-size:12px;
|
||
color:#b5975a;
|
||
margin-top:4px;
|
||
letter-spacing:1px
|
||
}
|
||
.pillar.self{background:linear-gradient(180deg,#2a1f2e,#1a1420);border-color:#5a3f5a}
|
||
.pillar.self .gan{color:#ffd966}
|
||
.pillar.self .zhi{color:#e6c88a}
|
||
|
||
/* highlight bar */
|
||
.highlight{
|
||
background:linear-gradient(90deg,transparent,#2a2030,transparent);
|
||
border:1px solid #3a2f4a;
|
||
border-radius:8px;
|
||
padding:12px 16px;
|
||
text-align:center;
|
||
margin-bottom:20px;
|
||
font-size:14px;
|
||
line-height:1.7;
|
||
color:#c9b896
|
||
}
|
||
.highlight strong{color:#f0e6c5}
|
||
.highlight .kill{color:#e05858}
|
||
.highlight .yin{color:#58aee0}
|
||
|
||
/* section */
|
||
.sec{
|
||
background:linear-gradient(180deg,#1a1522,#100d18);
|
||
border:1px solid #2a203a;
|
||
border-radius:10px;
|
||
padding:16px 14px;
|
||
margin-bottom:14px
|
||
}
|
||
.sec-title{
|
||
font-size:15px;
|
||
font-weight:600;
|
||
color:#f0e6c5;
|
||
text-align:center;
|
||
letter-spacing:3px;
|
||
margin-bottom:12px;
|
||
padding-bottom:8px;
|
||
border-bottom:1px solid #2a203a
|
||
}
|
||
|
||
/* ten gods grid */
|
||
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:6px}
|
||
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
|
||
.grid-item{
|
||
background:#1a1522;
|
||
border:1px solid #2a203a;
|
||
border-radius:6px;
|
||
padding:8px 6px;
|
||
text-align:center;
|
||
font-size:13px;
|
||
line-height:1.6
|
||
}
|
||
.grid-item .label{color:#6a5f7a;font-size:11px}
|
||
.grid-item .val{color:#d4c9a8;font-size:13px}
|
||
.grid-item .val.kill{color:#e05858}
|
||
.grid-item .val.yin{color:#58aee0}
|
||
.grid-item .val.guan{color:#e0a058}
|
||
.grid-item .val.cai{color:#58d0a0}
|
||
.grid-item .val.shang{color:#c0a0e0}
|
||
|
||
/* flow */
|
||
.flow{
|
||
display:flex;
|
||
align-items:center;
|
||
justify-content:center;
|
||
gap:4px;
|
||
margin:12px 0 8px;
|
||
font-size:15px;
|
||
flex-wrap:wrap
|
||
}
|
||
.flow-item{
|
||
background:#1a1522;
|
||
border:1px solid #2a203a;
|
||
border-radius:6px;
|
||
padding:6px 12px;
|
||
text-align:center
|
||
}
|
||
.flow-item .label{font-size:11px;color:#6a5f7a}
|
||
.flow-item .val{font-size:16px;font-weight:600}
|
||
.flow-item .val.k{color:#e05858}
|
||
.flow-item .val.y{color:#58aee0}
|
||
.flow-item .val.r{color:#ffd966}
|
||
.flow-arrow{color:#3a2f4a;font-size:16px;margin:0 4px}
|
||
|
||
/* dayun table */
|
||
.dayun-table{
|
||
width:100%;
|
||
border-collapse:collapse;
|
||
font-size:13px
|
||
}
|
||
.dayun-table td{
|
||
text-align:center;
|
||
padding:7px 4px;
|
||
border-bottom:1px solid #1a1522
|
||
}
|
||
.dayun-table tr:last-child td{border-bottom:none}
|
||
.dayun-table .dy-gan{font-weight:600;font-size:16px}
|
||
.dayun-table .dy-shen{color:#b5975a;font-size:11px}
|
||
.dayun-table .dy-age{color:#6a5f7a;font-size:11px}
|
||
.dayun-table tr.current td{background:rgba(88,174,224,.08);border-radius:4px;color:#f0e6c5}
|
||
.dayun-table .dy-year{color:#6a5f7a;font-size:11px}
|
||
|
||
/* hidden stems */
|
||
.hidden-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
|
||
.hidden-item{
|
||
background:#1a1522;
|
||
border:1px solid #2a203a;
|
||
border-radius:6px;
|
||
padding:8px;
|
||
text-align:center;
|
||
font-size:13px;
|
||
line-height:1.5
|
||
}
|
||
.hidden-item .zhi-name{color:#c9b896;font-size:12px;margin-bottom:2px}
|
||
.hidden-item .gz{display:flex;justify-content:center;gap:8px;font-size:13px}
|
||
.hidden-item .g{color:#d4c9a8}
|
||
.hidden-item .s{color:#b5975a;font-size:11px}
|
||
|
||
/* wuxing */
|
||
.wuxing{
|
||
display:flex;
|
||
justify-content:center;
|
||
gap:12px;
|
||
margin:8px 0
|
||
}
|
||
.wx-item{
|
||
width:52px;
|
||
height:52px;
|
||
border-radius:50%;
|
||
display:flex;
|
||
align-items:center;
|
||
justify-content:center;
|
||
flex-direction:column;
|
||
font-size:12px;
|
||
font-weight:600;
|
||
border:2px solid rgba(255,255,255,.08)
|
||
}
|
||
.wx-item .count{font-size:16px}
|
||
.wx-item.jin{background:rgba(224,88,88,.18);border-color:#e05858;color:#e05858}
|
||
.wx-item.mu{background:rgba(88,208,160,.18);border-color:#58d0a0;color:#58d0a0}
|
||
.wx-item.shui{background:rgba(88,174,224,.18);border-color:#58aee0;color:#58aee0}
|
||
.wx-item.huo{background:rgba(224,160,88,.18);border-color:#e0a058;color:#e0a058}
|
||
.wx-item.tu{background:rgba(192,160,224,.18);border-color:#c0a0e0;color:#c0a0e0}
|
||
|
||
/* text paragraph */
|
||
.para{font-size:13.5px;line-height:1.9;color:#c9b896;margin-bottom:8px}
|
||
.para:last-child{margin-bottom:0}
|
||
.para strong{color:#f0e6c5}
|
||
.para .kill{color:#e05858}
|
||
.para .yin{color:#58aee0}
|
||
.para .guan{color:#e0a058}
|
||
.para .cai{color:#58d0a0}
|
||
|
||
/* flow-year section */
|
||
.liunian-box{
|
||
background:rgba(88,174,224,.04);
|
||
border:1px solid rgba(88,174,224,.15);
|
||
border-radius:6px;
|
||
padding:10px;
|
||
margin-top:6px;
|
||
font-size:13px;
|
||
line-height:1.8;
|
||
color:#c9b896
|
||
}
|
||
|
||
/* footer */
|
||
.footer{
|
||
text-align:center;
|
||
font-size:11px;
|
||
color:#3a2f4a;
|
||
letter-spacing:2px;
|
||
margin-top:8px;
|
||
padding-top:16px;
|
||
border-top:1px solid #1a1522
|
||
}
|
||
|
||
@media(max-width:400px){
|
||
.pillars{gap:6px}
|
||
.pillar{width:70px;padding:8px 0 10px}
|
||
.pillar .gan{font-size:26px}
|
||
.pillar .zhi{font-size:22px}
|
||
body{padding:28px 10px 40px}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
|
||
<div class="title">三 命 通 览</div>
|
||
<div class="subtitle">庚辰年 · 庚辰月 · 甲寅日 · 癸酉时</div>
|
||
|
||
<!-- 四柱 -->
|
||
<div class="pillars">
|
||
<div class="pillar">
|
||
<div class="p-label">年</div>
|
||
<div class="gan" style="color:#e05858">庚</div>
|
||
<div class="zhi">辰</div>
|
||
<div class="p-shen">七杀</div>
|
||
</div>
|
||
<div class="pillar">
|
||
<div class="p-label">月</div>
|
||
<div class="gan" style="color:#e05858">庚</div>
|
||
<div class="zhi">辰</div>
|
||
<div class="p-shen">七杀</div>
|
||
</div>
|
||
<div class="pillar self">
|
||
<div class="p-label">日</div>
|
||
<div class="gan">甲</div>
|
||
<div class="zhi">寅</div>
|
||
<div class="p-shen">日主</div>
|
||
</div>
|
||
<div class="pillar">
|
||
<div class="p-label">时</div>
|
||
<div class="gan" style="color:#58aee0">癸</div>
|
||
<div class="zhi">酉</div>
|
||
<div class="p-shen">正印</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 杀印相生 -->
|
||
<div class="highlight">
|
||
<strong>杀印相生格局</strong>
|
||
· <span class="kill">庚</span>金七杀生<span class="yin">癸</span>水正印 ·
|
||
<span class="yin">癸</span>水正印生<span style="color:#ffd966">甲</span>木日主
|
||
</div>
|
||
|
||
<!-- 你的记忆 -->
|
||
<div class="sec">
|
||
<div class="sec-title">💡 你说的"两个七杀一个正印"</div>
|
||
<div class="grid-3">
|
||
<div class="grid-item">
|
||
<div class="label">七杀①</div>
|
||
<div class="val kill">年干 庚</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">七杀②</div>
|
||
<div class="val kill">月干 庚</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">正印</div>
|
||
<div class="val yin">时干 癸</div>
|
||
</div>
|
||
</div>
|
||
<div class="para" style="margin-top:8px;text-align:center">
|
||
完美对上。之前我按庚金日主算，七杀变丙、正印变己，自然对不上。<br>
|
||
<strong>甲木日主，七杀=庚，正印=癸，一字不差</strong>。
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 格局详解 -->
|
||
<div class="sec">
|
||
<div class="sec-title">杀印相生 · 格局评述</div>
|
||
<div class="para">
|
||
<strong>甲木参天</strong>生于辰月，暮春土旺木气渐衰。天干双透<span class="kill">庚金七杀</span>，克身之力极重，若无救应则身弱杀强、步步维艰。
|
||
</div>
|
||
<div class="flow">
|
||
<div class="flow-item"><div class="label">七杀</div><div class="val k">庚</div></div>
|
||
<span class="flow-arrow">→ 生 →</span>
|
||
<div class="flow-item"><div class="label">正印</div><div class="val y">癸</div></div>
|
||
<span class="flow-arrow">→ 生 →</span>
|
||
<div class="flow-item"><div class="label">日主</div><div class="val r">甲</div></div>
|
||
</div>
|
||
<div class="para">
|
||
妙在时柱见<span class="yin">癸水正印贴身相生</span>——
|
||
<span class="kill">七杀的压力</span>化作<span class="yin">正印的学习动力</span>，
|
||
正印再将养分输送给<span style="color:#ffd966">甲木日主</span>。
|
||
压力→学识→成长，<strong>流通无阻</strong>。
|
||
</div>
|
||
<div class="para">
|
||
时支<span class="guan">酉金（辛正官）</span>更为点睛——
|
||
杀印相生之后再生官，<strong>压力转化为权威</strong>，
|
||
代表最终走向管理岗、有实权有地位。
|
||
</div>
|
||
<div class="para"><strong>格局核心特质：</strong></div>
|
||
<div class="para">① 权威性格 · 不怒自威，天生有领导气场</div>
|
||
<div class="para">② 以学促用 · 善于通过学习思考化解问题</div>
|
||
<div class="para">③ 后发制人 · 前期压力大，但越走越稳</div>
|
||
<div class="para">④ 管理才能 · 既有权威（杀）又有智慧（印）</div>
|
||
</div>
|
||
|
||
<!-- 十神全表 -->
|
||
<div class="sec">
|
||
<div class="sec-title">十神全表</div>
|
||
<div class="grid-2">
|
||
<div class="grid-item">
|
||
<div class="label">年干</div>
|
||
<div class="val kill">庚 · 七杀</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">年支</div>
|
||
<div class="val cai">辰 · 偏财</div>
|
||
<div style="font-size:11px;color:#6a5f7a">藏戊(偏财) 乙(劫财) 癸(正印)</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">月干</div>
|
||
<div class="val kill">庚 · 七杀</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">月支</div>
|
||
<div class="val cai">辰 · 偏财</div>
|
||
<div style="font-size:11px;color:#6a5f7a">藏戊(偏财) 乙(劫财) 癸(正印)</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">日干</div>
|
||
<div class="val" style="color:#ffd966">甲 · 日主</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">日支</div>
|
||
<div class="val shang">寅 · 食神</div>
|
||
<div style="font-size:11px;color:#6a5f7a">藏甲(比肩) 丙(食神) 戊(偏财)</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">时干</div>
|
||
<div class="val yin">癸 · 正印</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">时支</div>
|
||
<div class="val guan">酉 · 正官</div>
|
||
<div style="font-size:11px;color:#6a5f7a">藏辛(正官)</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 藏干 -->
|
||
<div class="sec">
|
||
<div class="sec-title">地支藏干</div>
|
||
<div class="hidden-grid">
|
||
<div class="hidden-item">
|
||
<div class="zhi-name">辰（年支/月支）</div>
|
||
<div class="gz">
|
||
<span class="g"><span style="color:#58d0a0">戊</span> 偏财</span>
|
||
<span class="g"><span style="color:#58d0a0">乙</span> 劫财</span>
|
||
<span class="g"><span style="color:#58aee0">癸</span> 正印</span>
|
||
</div>
|
||
</div>
|
||
<div class="hidden-item">
|
||
<div class="zhi-name">寅（日支）</div>
|
||
<div class="gz">
|
||
<span class="g"><span style="color:#58d0a0">甲</span> 比肩</span>
|
||
<span class="g"><span style="color:#e0a058">丙</span> 食神</span>
|
||
<span class="g"><span style="color:#58d0a0">戊</span> 偏财</span>
|
||
</div>
|
||
</div>
|
||
<div class="hidden-item">
|
||
<div class="zhi-name">酉（时支）</div>
|
||
<div class="gz">
|
||
<span class="g"><span style="color:#e0a058">辛</span> 正官</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 纳音五行 -->
|
||
<div class="sec">
|
||
<div class="sec-title">纳音五行</div>
|
||
<div class="grid-2">
|
||
<div class="grid-item">
|
||
<div class="label">年柱</div>
|
||
<div class="val" style="color:#e05858">庚辰 · 白蜡金</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">月柱</div>
|
||
<div class="val" style="color:#e05858">庚辰 · 白蜡金</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">日柱</div>
|
||
<div class="val" style="color:#58aee0">甲寅 · 大溪水</div>
|
||
</div>
|
||
<div class="grid-item">
|
||
<div class="label">时柱</div>
|
||
<div class="val" style="color:#e05858">癸酉 · 剑锋金</div>
|
||
</div>
|
||
</div>
|
||
<div class="wuxing">
|
||
<div class="wx-item jin"><span class="count">4</span>金</div>
|
||
<div class="wx-item mu"><span class="count">3</span>木</div>
|
||
<div class="wx-item shui"><span class="count">3</span>水</div>
|
||
<div class="wx-item huo"><span class="count">1</span>火</div>
|
||
<div class="wx-item tu"><span class="count">3</span>土</div>
|
||
</div>
|
||
<div class="para" style="text-align:center;font-size:12px;margin-top:4px">
|
||
<span style="color:#e05858">金旺</span>为杀印之源，<span style="color:#58d0a0">木有寅根</span>得印生，
|
||
<span style="color:#58aee0">水火调候</span>俱备，<span style="color:#c0a0e0">土</span>为财星有制
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 大运 -->
|
||
<div class="sec">
|
||
<div class="sec-title">大运 · 顺排</div>
|
||
<div class="para" style="text-align:center;font-size:12px;color:#6a5f7a">
|
||
阳男顺排 · 约3岁起运 · 每10年一运
|
||
</div>
|
||
<table class="dayun-table">
|
||
<tr>
|
||
<td><span class="dy-age">03-12</span></td>
|
||
<td><span class="dy-gan" style="color:#e05858">辛</span><span style="color:#c0a0e0">巳</span></td>
|
||
<td class="dy-shen">正官</td>
|
||
<td class="dy-year">2003-2012</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="dy-age">13-22</span></td>
|
||
<td><span class="dy-gan" style="color:#e05858">壬</span><span style="color:#58aee0">午</span></td>
|
||
<td class="dy-shen">偏印</td>
|
||
<td class="dy-year">2013-2022</td>
|
||
</tr>
|
||
<tr class="current">
|
||
<td><span class="dy-age">23-32</span></td>
|
||
<td><span class="dy-gan" style="color:#58aee0">癸</span><span style="color:#6a5f7a">未</span></td>
|
||
<td class="dy-shen">正印</td>
|
||
<td class="dy-year">2023-2032</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="dy-age">33-42</span></td>
|
||
<td><span style="color:#ffd966">甲</span><span style="color:#e0a058">申</span></td>
|
||
<td class="dy-shen">比肩</td>
|
||
<td class="dy-year">2033-2042</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="dy-age">43-52</span></td>
|
||
<td><span style="color:#58d0a0">乙</span><span style="color:#e0a058">酉</span></td>
|
||
<td class="dy-shen">劫财</td>
|
||
<td class="dy-year">2043-2052</td>
|
||
</tr>
|
||
<tr>
|
||
<td><span class="dy-age">53-62</span></td>
|
||
<td><span style="color:#e05858">丙</span><span style="color:#c0a0e0">戌</span></td>
|
||
<td class="dy-shen">食神</td>
|
||
<td class="dy-year">2053-2062</td>
|
||
</tr>
|
||
</table>
|
||
<div class="para" style="font-size:12px;text-align:center;color:#6a5f7a;margin-top:4px">
|
||
当前 · <strong style="color:#58aee0">癸未大运</strong>（正印运，增强印星力量）
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 2026流年 -->
|
||
<div class="sec">
|
||
<div class="sec-title">2026丙午 · 流年</div>
|
||
<div class="liunian-box">
|
||
<div class="para">
|
||
<strong style="color:#e0a058">丙午</strong>流年，丙火食神透出，午火为伤官。食神泄秀生财，<strong>想法多、行动力强</strong>。
|
||
</div>
|
||
<div class="para">
|
||
大运癸未与流年丙午：丙癸相见，<span class="yin">正印</span>配<span style="color:#e0a058">食神</span>，<strong>以技术/知识创造价值</strong>的一年。食神制杀（丙制庚），压力感明显减轻。
|
||
</div>
|
||
<div class="para">
|
||
午未合火，加强了全局的火力——<strong>食伤力量提升</strong>，适合技术产品落地、内容创作、方案输出。
|
||
</div>
|
||
<div class="para">
|
||
<strong style="color:#e05858">注意：</strong>丙辛合（流年丙合时支辛），正官被合，职场/管理上可能有变动，或因新方向冲击原有岗位结构。食伤太旺耗身，注意精力分配。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 总结 -->
|
||
<div class="sec">
|
||
<div class="sec-title">格局总评</div>
|
||
<div class="para">
|
||
<strong>甲木参天 · 双庚为杀 · 癸水为印 · 杀印相生</strong>
|
||
</div>
|
||
<div class="para">
|
||
三奇得一：年干庚（杀）→ 时干癸（印）→ 日主甲，链式流通。<br>
|
||
日坐寅木（禄地），身不太弱，能扛住两庚克制。<br>
|
||
时支酉官收尾，杀印生官——<strong>压力→智慧→地位</strong>，路数清晰。
|
||
</div>
|
||
<div class="para" style="text-align:center;margin-top:6px">
|
||
<span style="font-size:12px;color:#6a5f7a;letter-spacing:2px">
|
||
庚辰年 · 庚辰月 · 甲寅日 · 癸酉时
|
||
</span>
|
||
</div>
|
||
<div class="para" style="text-align:center;font-size:12px;color:#6a5f7a">
|
||
山东东营广饶 · 真太阳时校正后仍为酉时
|
||
</div>
|
||
</div>
|
||
|
||
<div class="footer">杀印相生 · 权印双收</div>
|
||
|
||
</div>
|
||
</body>
|
||
</html>
|