mirror of
https://github.com/tiennm99/programming-fengshui.git
synced 2026-05-18 23:28:50 +00:00
tiennm99
5bca4d92ec
Ruby moves to HOẢ (was THỔ). THUỶ gains C++ and CSS, drops C#. MỘC gains Node.js (was HOẢ) and keeps C# (was THUỶ). THỔ now only JavaScript and Go.
125 lines
4.9 KiB
HTML
125 lines
4.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="vi">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Lựa chọn ngôn ngữ lập trình theo phong thuỷ</title>
|
|
<meta name="description" content="Chọn ngôn ngữ lập trình theo Ngũ Hành: Kim, Mộc, Thuỷ, Hoả, Thổ — vui là chính." />
|
|
<link rel="stylesheet" href="style.css" />
|
|
</head>
|
|
<body>
|
|
<a class="skip-link" href="#main-content">Bỏ qua tới nội dung chính</a>
|
|
<main class="page" id="main-content">
|
|
<header class="hero">
|
|
<h1>Lựa chọn ngôn ngữ lập trình theo phong thuỷ</h1>
|
|
<p class="subtitle">Ngũ Hành tương sinh — code cho hợp tuổi, hợp mệnh.</p>
|
|
<div class="hero-ribbon" aria-hidden="true">
|
|
<span class="r-kim"></span>
|
|
<span class="r-moc"></span>
|
|
<span class="r-thuy"></span>
|
|
<span class="r-hoa"></span>
|
|
<span class="r-tho"></span>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="mode-toggle" role="tablist" aria-label="Chế độ hiển thị">
|
|
<button type="button" role="tab" id="tab-classic" data-mode="classic"
|
|
aria-controls="panel-classic" aria-selected="true" tabindex="0">
|
|
Cổ điển (bài gốc)
|
|
</button>
|
|
<button type="button" role="tab" id="tab-modern" data-mode="modern"
|
|
aria-controls="panel-modern" aria-selected="false" tabindex="-1">
|
|
Hiện đại (tự phân loại)
|
|
</button>
|
|
</div>
|
|
|
|
<section id="panel-classic" role="tabpanel" aria-labelledby="tab-classic">
|
|
<section class="figure">
|
|
<figure>
|
|
<img
|
|
src="assets/ngon-ngu-lap-trinh-phong-thuy.png"
|
|
alt="Sơ đồ phong thuỷ ngôn ngữ lập trình theo Ngũ Hành"
|
|
/>
|
|
<figcaption>Sơ đồ ngôn ngữ lập trình xếp theo Ngũ Hành.</figcaption>
|
|
</figure>
|
|
</section>
|
|
|
|
<section class="elements">
|
|
<h2>Ngũ Hành & ngôn ngữ <small class="mode-tag">(theo bài gốc, 2018)</small></h2>
|
|
<div class="grid">
|
|
<article class="card kim">
|
|
<h3>KIM</h3>
|
|
<p>JavaScript, Objective-C, Python</p>
|
|
</article>
|
|
<article class="card thuy">
|
|
<h3>THUỶ</h3>
|
|
<p>C++, CSS, PHP</p>
|
|
</article>
|
|
<article class="card moc">
|
|
<h3>MỘC</h3>
|
|
<p>Android, C#, Node.js</p>
|
|
</article>
|
|
<article class="card hoa">
|
|
<h3>HOẢ</h3>
|
|
<p>Scala, HTML5, Java, Ruby</p>
|
|
</article>
|
|
<article class="card tho">
|
|
<h3>THỔ</h3>
|
|
<p>JavaScript, Go</p>
|
|
</article>
|
|
</div>
|
|
<p class="disclaimer">* Bảng phân loại mang tính giải trí, lấy từ ảnh gốc.</p>
|
|
</section>
|
|
</section>
|
|
|
|
<section id="panel-modern" role="tabpanel" aria-labelledby="tab-modern" hidden>
|
|
<section class="elements">
|
|
<h2>Ngũ Hành & ngôn ngữ <small class="mode-tag" id="source-tag">Nguồn: GitHub Linguist</small></h2>
|
|
<div class="modern-controls">
|
|
<div id="source-toggle"></div>
|
|
<div id="view-toggle"></div>
|
|
</div>
|
|
<div class="grid" id="element-grid"></div>
|
|
<p class="legend"></p>
|
|
<details id="debug-panel" hidden></details>
|
|
<p class="disclaimer">* Mặc định hiển thị TIOBE Top 20 (April 2026). Bấm "Xem tất cả ngôn ngữ" để mở rộng. Có thể đổi nguồn màu giữa GitHub Linguist và GitLab Linguist (palette khác hẳn).</p>
|
|
</section>
|
|
<details class="original-image">
|
|
<summary>Ảnh gốc</summary>
|
|
<figure>
|
|
<img
|
|
src="assets/ngon-ngu-lap-trinh-phong-thuy.png"
|
|
alt="Sơ đồ phong thuỷ ngôn ngữ lập trình theo Ngũ Hành"
|
|
/>
|
|
<figcaption>Sơ đồ ngôn ngữ lập trình xếp theo Ngũ Hành.</figcaption>
|
|
</figure>
|
|
</details>
|
|
</section>
|
|
|
|
<footer class="credit">
|
|
<h2>Credit</h2>
|
|
<p>
|
|
Hình ảnh và nội dung gốc thuộc về tác giả Phạm Huy Hoàng (Tôi đi code dạo).
|
|
</p>
|
|
<ul>
|
|
<li>
|
|
Bài viết:
|
|
<a href="https://toidicodedao.com/2018/01/02/top-5-ngon-ngu-lap-trinh-dang-hoc-cho-nam-2018/" target="_blank" rel="noopener noreferrer">
|
|
Top 5 ngôn ngữ lập trình đáng học cho năm 2018
|
|
</a>
|
|
</li>
|
|
<li>
|
|
Ảnh:
|
|
<a href="https://toidicodedao.com/wp-content/uploads/2017/12/ngon-ngu-lap-trinh-phong-thuy.png" target="_blank" rel="noopener noreferrer">
|
|
ngon-ngu-lap-trinh-phong-thuy.png
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<p class="note">Trang này chỉ dùng cho mục đích trình bày lại nội dung, mọi quyền thuộc về tác giả gốc.</p>
|
|
</footer>
|
|
</main>
|
|
<script type="module" src="./js/mode-toggle.js"></script>
|
|
<script type="module" src="./js/main.js"></script>
|
|
</body>
|
|
</html>
|