{"id":223,"date":"2025-07-28T01:21:16","date_gmt":"2025-07-28T01:21:16","guid":{"rendered":"https:\/\/sbrchhs.edu.my\/history\/?page_id=223"},"modified":"2025-11-27T01:31:21","modified_gmt":"2025-11-27T01:31:21","slug":"%e5%8e%86%e4%bb%bb%e6%a0%a1%e5%8f%8b%e4%bc%9a%e4%b8%bb%e5%b8%ad%e7%8e%89%e7%85%a7","status":"publish","type":"page","link":"https:\/\/sbrchhs.edu.my\/history\/%e5%8e%86%e4%bb%bb%e6%a0%a1%e5%8f%8b%e4%bc%9a%e4%b8%bb%e5%b8%ad%e7%8e%89%e7%85%a7\/","title":{"rendered":"\u5386\u4efb\u6821\u53cb\u4f1a\u4e3b\u5e2d\u7389\u7167"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \u5386\u5c4a\u6821\u53cb\u4f1a\u4e3b\u5e2d<\/title>\r\n <style>\r\n body {\r\n font-family: \"KaiTi\", \"STKaiti\", \"SimSun\", serif;\r\n background: #ffffff url('https:\/\/transparenttextures.com\/patterns\/paper-fibers.png');\r\n color: #5c3a1e;\r\n text-align: center;\r\n font-size: 16px;\r\n }\r\n\r\n h1 {\r\n font-size: 48px;\r\n letter-spacing: 3px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n display: block;\r\n padding-bottom: 8px;\r\n }\r\n h1::after {\r\n content: '';\r\n display: block;\r\n width: 150px;\r\n height: 3px;\r\n background: #5c3a21;\r\n margin: 15px auto 0;\r\n }\r\n\r\n h2 {\r\n font-size: 26px;\r\n font-weight: normal;\r\n color: #5c3a21;\r\n margin: 25px auto 50px;\r\n line-height: 1.8;\r\n text-align: center;\r\n max-width: 700px;\r\n }\r\n h2::before,\r\n h2::after {\r\n content: '';\r\n display: block;\r\n width: 70%;\r\n height: 2px;\r\n background: #5c3a21;\r\n margin: 14px auto;\r\n }\r\n\r\n \/* \u5361\u7247\u5e03\u5c40 *\/\r\n .grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));\r\n gap: 30px;\r\n max-width: 1000px;\r\n margin: auto;\r\n }\r\n\r\n .card {\r\n background: #fffaf0;\r\n border: 1px solid #d3bfa6;\r\n border-radius: 8px;\r\n padding: 20px;\r\n box-shadow: 2px 2px 6px rgba(92, 58, 33, 0.2);\r\n transition: transform 0.3s ease, box-shadow 0.3s ease;\r\n }\r\n .card:hover {\r\n transform: translateY(-6px);\r\n box-shadow: 4px 6px 12px rgba(92, 58, 33, 0.3);\r\n }\r\n\r\n .photo {\r\n width: 120px;\r\n height: 150px;\r\n margin: 0 auto 15px;\r\n border: 1px solid #5c3a21;\r\n overflow: hidden;\r\n background: #eee; \/* \u5360\u4f4d\u80cc\u666f *\/\r\n cursor: zoom-in;\r\n }\r\n .photo img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n }\r\n\r\n .card h3 {\r\n margin: 0;\r\n font-size: 20px;\r\n font-weight: bold;\r\n color: #5c3a21;\r\n }\r\n .card p.year {\r\n margin: 6px 0 0;\r\n font-size: 18px;\r\n font-weight: bold;\r\n color: #7a4a21;\r\n }\r\n\r\n \/* \u653e\u5927\u56fe\u5c42 *\/\r\n .lightbox {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0, 0, 0, 0.8);\r\n display: none;\r\n justify-content: center;\r\n align-items: center;\r\n z-index: 999;\r\n }\r\n .lightbox img {\r\n max-width: 90%;\r\n max-height: 90%;\r\n border: 4px solid #fff;\r\n border-radius: 10px;\r\n box-shadow: 0 0 20px rgba(0,0,0,0.5);\r\n }\r\n\r\n \/* \u624b\u673a\u7248\u4f18\u5316 *\/\r\n @media screen and (max-width: 600px) {\r\n h1 { font-size: 36px; }\r\n h2 { font-size: 20px; }\r\n .card h3 { font-size: 18px; }\r\n .card p.year { font-size: 16px; }\r\n .photo { width: 100px; height: 130px; }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <h1 align=\"center\">\u5386\u5c4a\u6821\u53cb\u4f1a\u4e3b\u5e2d<\/h1>\r\n <h2>\u6821\u53cb\u662f\u4eba\u624d\u4ea7\u54c1\uff0c\u66f4\u662f\u5b66\u6821\u7684\u54c1\u724c\u5f62\u8c61<\/h2>\r\n\r\n <div class=\"grid\">\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/1.\u4e18\u81ea\u767c.png\" alt=\"\u4e18\u81ea\u53d1\"><\/div>\r\n <h3>\u7b2c\u4e00\u4efb \u4e18\u81ea\u53d1<\/h3>\r\n <p class=\"year\">1973 - 1976<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/2.\u65bd\u5149\u8f89.png\" alt=\"\u65bd\u5149\u8f89\"><\/div>\r\n <h3>\u7b2c\u4e8c\u4efb \u65bd\u5149\u8f89<\/h3>\r\n <p class=\"year\">1977 - 1982<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/3.\u6797\u732e\u5929.png\" alt=\"\u6797\u7337\u5929\"><\/div>\r\n <h3>\u7b2c\u4e09\u4efb \u6797\u7337\u5929<\/h3>\r\n <p class=\"year\">1983 - 1984<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/4.\u90d1\u632f\u6751.png\" alt=\"\u90d1\u632f\u6751\"><\/div>\r\n <h3>\u7b2c\u56db\u4efb \u90d1\u632f\u6751<\/h3>\r\n <p class=\"year\">1985 - 1986<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/5.\u5173\u88d4\u5f3a.png\" alt=\"\u5173\u88d4\u5f3a\"><\/div>\r\n <h3>\u7b2c\u4e94\u4efb \u5173\u88d4\u5f3a<\/h3>\r\n <p class=\"year\">1987 - 1992<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/\u738b\u5229\u6210\u9ad8\u6e05\u5bf8\u7167-scaled.png\" alt=\"\u738b\u5229\u57ce\"><\/div>\r\n <h3>\u7b2c\u516d\u4efb \u738b\u5229\u57ce<\/h3>\r\n <p class=\"year\">1993 - 1996<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/7\u90d1\u4ea6\u5065.png\" alt=\"\u90d1\u4ea6\u5065\"><\/div>\r\n <h3>\u7b2c\u4e03\u4efb \u90d1\u4ea6\u5065<\/h3>\r\n <p class=\"year\">1997 - 1998<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/8\u9f9a\u5fe0\u5e86.png\" alt=\"\u9f9a\u5fe0\u5e86\"><\/div>\r\n <h3>\u7b2c\u516b\u4efb \u9f9a\u5fe0\u5e86<\/h3>\r\n <p class=\"year\">1999 - 2004<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/9\u6b27\u9633\u842a\u664b.png\" alt=\"\u6b27\u9633\u842a\u664b\"><\/div>\r\n <h3>\u7b2c\u4e5d\u4efb \u6b27\u9633\u842a\u664b<\/h3>\r\n <p class=\"year\">2005 - 2008<\/p>\r\n <\/div>\r\n\r\n <div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/10\u8427\u5e86\u748b.png\" alt=\"\u8427\u5e86\u748b\"><\/div>\r\n <h3>\u7b2c\u5341\u4efb \u8427\u5e86\u748b<\/h3>\r\n <p class=\"year\">2009 - 2020<\/p>\r\n <\/div>\r\n \r\n\t<div class=\"card\">\r\n <div class=\"photo\"><img decoding=\"async\" src=\"https:\/\/sbrchhs.edu.my\/history\/wp-content\/uploads\/2025\/11\/11.\u90d1\u6e05\u83ef.png\" alt=\"\u90d1\u6e05\u534e\"><\/div>\r\n <h3>\u7b2c\u5341\u4e00\u4efb \u90d1\u6e05\u534e<\/h3>\r\n <p class=\"year\">2021 - 2024 <\/p>\r\n <\/div>\r\n \r\n \r\n <\/div>\r\n \r\n <!-- \u653e\u5927\u663e\u793a\u7528\u7684 lightbox -->\r\n <div class=\"lightbox\" id=\"lightbox\">\r\n <img decoding=\"async\" src=\"\" alt=\"\">\r\n <\/div>\r\n\r\n <script>\r\n const photos = document.querySelectorAll('.photo img');\r\n const lightbox = document.getElementById('lightbox');\r\n const lightboxImg = lightbox.querySelector('img');\r\n\r\n photos.forEach(photo => {\r\n photo.addEventListener('click', () => {\r\n lightboxImg.src = photo.src;\r\n lightbox.style.display = 'flex';\r\n });\r\n });\r\n\r\n lightbox.addEventListener('click', () => {\r\n lightbox.style.display = 'none';\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u5386\u5c4a\u6821\u53cb\u4f1a\u4e3b\u5e2d \u5386\u5c4a\u6821\u53cb\u4f1a\u4e3b\u5e2d \u6821\u53cb\u662f\u4eba\u624d\u4ea7\u54c1\uff0c\u66f4\u662f\u5b66\u6821\u7684\u54c1\u724c\u5f62\u8c61 \u7b2c\u4e00\u4efb \u4e18\u81ea\u53d1 1973 – […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-223","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/sbrchhs.edu.my\/history\/wp-json\/wp\/v2\/pages\/223","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sbrchhs.edu.my\/history\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sbrchhs.edu.my\/history\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sbrchhs.edu.my\/history\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sbrchhs.edu.my\/history\/wp-json\/wp\/v2\/comments?post=223"}],"version-history":[{"count":37,"href":"https:\/\/sbrchhs.edu.my\/history\/wp-json\/wp\/v2\/pages\/223\/revisions"}],"predecessor-version":[{"id":1653,"href":"https:\/\/sbrchhs.edu.my\/history\/wp-json\/wp\/v2\/pages\/223\/revisions\/1653"}],"wp:attachment":[{"href":"https:\/\/sbrchhs.edu.my\/history\/wp-json\/wp\/v2\/media?parent=223"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}