CINXE.COM
CityUAlbum | City University of Hong Kong
<!DOCTYPE html> <html lang="en"> <head id="ctl00_Head1"> <!-- Required meta tags --> <meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /> <!-- Preconnect --> <link rel="preconnect" href="//template.cityu.edu.hk/" /> <!-- Required CSS --> <link rel="stylesheet" href="//template.cityu.edu.hk/template/v2/css/bootstrap/bootstrap.min.css" /><link rel="stylesheet" href="//template.cityu.edu.hk/template/v2/css/cityu.base.css" /><link rel="stylesheet" href="//template.cityu.edu.hk/template/v2/css/fontawesome/css/all.min.css" /><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap" crossorigin="anonymous" /> <!-- Optional CSS --> <link rel="stylesheet" href="//template.cityu.edu.hk/template/v2/css/aos/aos.css" /><link rel="stylesheet" href="//template.cityu.edu.hk/template/v2/css/animate.css/animate.min.css" /> <!-- Place your custom CSS here --> <link rel="stylesheet" type="text/css" href="css/CityImage2.css?v=202309" /> <title>CityUAlbum | City University of Hong Kong</title> <meta name="author" content="City University of Hong Kong" /><meta name="description" content="CityUAlbum -- City University of Hong Kong" /><meta name="keywords" content="CityUAlbum, City University of Hong Kong, City University, CityU" /><meta name="robots" content="index, follow" /><title> </title></head> <body class="cityu-template-2 cityu-template-2-0 cityu-base-layout cityu-base-style"> <form name="aspnetForm" method="post" action="./" id="aspnetForm"> <div> <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" /> <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" /> <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTk0OTYzMjM2NA9kFgJmD2QWAgIDD2QWAgIHD2QWBAIBD2QWAgIBDxAPFgYeDURhdGFUZXh0RmllbGQFDENhdGVnb3J5TmFtZR4ORGF0YVZhbHVlRmllbGQFDENhdGVnb3J5Q29kZR4LXyFEYXRhQm91bmRnZBAVBRooUGxlYXNlIHNlbGVjdCBhIGNhdGVnb3J5KQZDYW1wdXMMU3R1ZGVudCBMaWZlE1Jlc2VhcmNoIGV4Y2VsbGVuY2UVVGVhY2hpbmcgYW5kIExlYXJuaW5nFQUBMAExATIBMwE0FCsDBWdnZ2dnFgFmZAIPD2QWAgIBD2QWAgIDDxBkZBYAZBgBBR5fX0NvbnRyb2xzUmVxdWlyZVBvc3RCYWNrS2V5X18WCAUlY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRJZDJDZTdkajN0MwUlY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRJbTJDZTdkajN0MQUlY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRJZDJDZTdkajN0NAUlY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRJbTJDZTdkajN0MwUlY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRJZDJDZTdkajN0MQUlY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRJbTJDZTdkajN0MgUlY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRJZDJDZTdkajN0MgUlY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRJbTJDZTdkajN0NDxml5AEgkvKx/P/lWOsDYeAgNcA" /> </div> <script type="text/javascript"> //<![CDATA[ var theForm = document.forms['aspnetForm']; if (!theForm) { theForm = document.aspnetForm; } function __doPostBack(eventTarget, eventArgument) { if (!theForm.onsubmit || (theForm.onsubmit() != false)) { theForm.__EVENTTARGET.value = eventTarget; theForm.__EVENTARGUMENT.value = eventArgument; theForm.submit(); } } //]]> </script> <div> <input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="CD109F58" /> <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEdABDURVMRKA0BcsY5i+S3YRS7TggnxhGL8JtuOJ+XD+ds4fZc6S13WsTUYEnSZPVDraF0calbIsuHTC6XNJukkatEFvs9Fk8zb2ifn5UuO7tEenKKmBVHUi1Kmz6qzLoZjxUSn43GsycXodAiahIJZ32SZmXrNlDgvi2rECJWCAv/WhKSJ3OaX/shAoZ0phOtZCsQaA+qiAdZmBWgNRBdsIgR6Txt3pmUi2ra/zuPdJVoptHlpbJCYbph0spTgBzHl6x+Eb9r5Ti+C9AM/k4E9373ZAcOglk/EO59WaJxtk/9SQ1KDeJVnuUB678GE1IY1vqCS1OvBXriJWVznAgxpIhwoIXZPuWUgBNA8HvDEwp6Nd8kwhw=" /> </div> <header class="cityu-header header-color-default"> <div class="cityu-header-inner container" id="cityu-header"> <!-- Header : Large screen --> <div class="cityu-header-lg d-none d-lg-block"> <div class="d-flex flex-row"> <div class="cityu-header-logo-lg align-self-center"> <a href="https://www.cityu.edu.hk" rel="noopener" target="_blank"> <img src="//template.cityu.edu.hk/template/v2/logo/CityU/CityU_Vertical_Logo_CMYK.svg" alt="City University of Hong Kong" /> </a> </div> <div class="cityu-header-name-lg align-self-center"> <a href="./"> CityUAlbum </a> </div> <!-- Tools --> <div class="cityu-tools ml-auto align-self-start d-flex flex-row"> <div class="cityualbum-toolbar align-self-center"> <a href="#" onclick="ShowAbout();">About the Album</a> | <a id="ctl00_appToolbar_HelpBtn" href="javascript:__doPostBack('ctl00$appToolbar$HelpBtn','')">Help</a> </div> </div> </div> </div> <!-- Header : Small screen --> <div class="cityu-header-md d-lg-none"> <div class="d-flex flex-row"> <div class="cityu-header-logo-md align-self-center"> <a href="https://www.cityu.edu.hk" rel="noopener" target="_blank"> <img src="//template.cityu.edu.hk/template/v2/logo/CityU/CityU_Mini_Logo.svg" alt="City University of Hong Kong"> </a> </div> <div class="cityu-header-name-md align-self-center"> <a href="./"> CityUAlbum </a> </div> </div> </div> </div> </header> <!-- Main --> <!-- Main --> <main class="cityu-main"> <div class="cityu-main-inner container"> <!-- Content --> <div id="albumToolbar" style="padding-top: 16px !important; padding-bottom: 8px !important; margin:0 !important; background-color: #F0F9F8; border-radius: 6px;"> <div class="form-row"> <!-- searchbox --> <div class="col col-md-5 col-lg-6 pb-2 pb-md-0 pl-3 pr-sm-5 pr-3 d-none d-md-block"> </div> <div class="col-6 col-sm pb-2 pb-sm-0 pl-3 pl-sm-3 pl-xl-5"> <input name="ctl00$ContentPlaceHolder1$searchBox" type="text" id="ctl00_ContentPlaceHolder1_searchBox" class="form-control form-control-sm" placeholder="Search keywords" /> </div> <div class="col-6 col-sm pb-2 pb-sm-0 pr-3 pr-sm-1"> <select name="ctl00$ContentPlaceHolder1$searchForList" id="ctl00_ContentPlaceHolder1_searchForList" class="form-control form-control-sm"> <option selected="selected" value="All">All</option> <option value="Description">Description</option> <option value="Filename">Filename</option> </select> </div> <div id="ctl00_ContentPlaceHolder1_searchPanel" class="col pb-0 small pl-3 pl-sm-1"> <input type="submit" name="ctl00$ContentPlaceHolder1$searchBtn" value="Search" id="ctl00_ContentPlaceHolder1_searchBtn" class="btn btn-cityured btn-sm" /> <a id="ctl00_ContentPlaceHolder1_hintButton" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$hintButton','')">Hint</a> </div> </div> </div> <div class="row" id="layer1"> <div class="col"> <div id="ctl00_ContentPlaceHolder1_CategoryPanel" class="row align-items-center album-home album-bg-home m-0 p-5"> <div class="col-12 col-sm-12 col-md-6 col-lg-6"> <div class="align-content-center pe-5"> <div class="album-home-txt album-txt-desktop"> <h1 class="album-home-title">About the album</h1> <hr /> <p> Welcome to the CityU Album! Here we showcase our diversified campus life, our cutting-edge facilities and snapshots of special moments at CityU. </p> <p> We are pleased to share these unique moments with you. But please acknowledge CityU if you use any of the images, and please don鈥檛 use them for commercial purposes. If you have any questions, please contact us at <a class="album-home-mailto" href="mailto:cpro@cityu.edu.hk">cpro@cityu.edu.hk</a>. </p> </div> </div> </div> <div class="col-12 col-sm-12 col-md-6 col-lg-6"> <div class="row align-items-center"> <div class="col-12 col-sm-12 col-md-5 col-lg-5 p-0"> <div class="p-1 m-1 album-img-block"> <input type="image" name="ctl00$ContentPlaceHolder1$Id2Ce7dj3t3" id="ctl00_ContentPlaceHolder1_Id2Ce7dj3t3" class="img-fluid album-img-desktop" src="images/research-excellent.jpg" alt="Research Excellent" style="border-width:0px;" /> <!-- <img class="img-fluid album-img-desktop" src="images/research-excellent.jpg" alt="research-excellent">--> <input type="image" name="ctl00$ContentPlaceHolder1$Im2Ce7dj3t1" id="ctl00_ContentPlaceHolder1_Im2Ce7dj3t1" class="img-fluid album-img-mobile" src="images/mobile-campus.jpg" alt="Campus" style="border-width:0px;" /> <!-- <img class="img-fluid album-img-mobile" src="images/mobile-campus.jpg" alt="campus"> --> <div class="album-img-title album-txt-desktop album-research"> <div class="album-img-title-inner">Research Excellent</div> </div> <div class="album-img-title album-txt-mobile album-campus"> <div class="album-img-title-inner">Campus</div> </div> </div> </div> <div class="col-12 col-sm-12 col-md-7 col-lg-7 p-0"> <div class="p-1 m-1 album-img-block"> <input type="image" name="ctl00$ContentPlaceHolder1$Id2Ce7dj3t4" id="ctl00_ContentPlaceHolder1_Id2Ce7dj3t4" class="img-fluid album-img-desktop" src="images/teaching-learning.jpg" alt="Teaching and Learning" style="border-width:0px;" /> <!-- <img class="img-fluid album-img-desktop" src="images/teaching-learning.jpg" alt="teaching-learning">--> <input type="image" name="ctl00$ContentPlaceHolder1$Im2Ce7dj3t3" id="ctl00_ContentPlaceHolder1_Im2Ce7dj3t3" class="img-fluid album-img-mobile" src="images/mobile-research-excellent.jpg" alt="Research Excellent" style="border-width:0px;" /> <!-- <img class="img-fluid album-img-mobile" src="images/mobile-research-excellent.jpg" alt="research-excellent"> --> <div class="album-img-title album-txt-desktop album-teaching-learning"> <div class="album-img-title-inner">Teaching & Learning</div> </div> <div class="album-img-title album-txt-mobile album-research"> <div class="album-img-title-inner">Research Excellent</div> </div> </div> <div class="p-1 m-1 album-img-block order-md-1"> <input type="image" name="ctl00$ContentPlaceHolder1$Id2Ce7dj3t1" id="ctl00_ContentPlaceHolder1_Id2Ce7dj3t1" class="img-fluid album-img-desktop" src="images/campus.jpg" alt="Campus" style="border-width:0px;" /> <!-- <img class="img-fluid album-img-desktop" src="images/campus.jpg" alt="campus"> --> <input type="image" name="ctl00$ContentPlaceHolder1$Im2Ce7dj3t2" id="ctl00_ContentPlaceHolder1_Im2Ce7dj3t2" class="img-fluid album-img-mobile" src="images/mobile-student-life.jpg" alt="Student Life" style="border-width:0px;" /> <!-- <img class="img-fluid album-img-mobile" src="images/mobile-student-life.jpg" alt="student-life"> --> <div class="album-img-title album-txt-desktop album-campus"> <div class="album-img-title-inner">Campus</div> </div> <div class="album-img-title album-txt-mobile album-student-life"> <div class="album-img-title-inner">Student Life</div> </div> </div> </div> </div> <div class="row align-items-center"> <div class="col-12 col-sm-12 col-md-8 col-lg-8 p-0"> <div class="p-1 m-1 album-img-block"> <input type="image" name="ctl00$ContentPlaceHolder1$Id2Ce7dj3t2" id="ctl00_ContentPlaceHolder1_Id2Ce7dj3t2" class="img-fluid album-img-desktop" src="images/student-life.jpg" alt="Student Life" style="border-width:0px;" /> <!-- <img class="img-fluid album-img-desktop" src="images/student-life.jpg" alt="student-life"> --> <input type="image" name="ctl00$ContentPlaceHolder1$Im2Ce7dj3t4" id="ctl00_ContentPlaceHolder1_Im2Ce7dj3t4" class="img-fluid album-img-mobile" src="images/mobile-teaching-learning.jpg" alt="Teaching and Learning" style="border-width:0px;" /> <!-- <img class="img-fluid album-img-mobile" src="images/mobile-teaching-learning.jpg" alt="teaching-learning"> --> <div class="album-img-title album-txt-desktop album-student-life"> <div class="album-img-title-inner">Student Life</div> </div> <div class="album-img-title album-txt-mobile album-teaching-learning"> <div class="album-img-title-inner">Teaching & Learning</div> </div> </div> </div> <div class="col-12 col-sm-12 col-md-4 col-lg-4 p-0 album-square"> <div class="p-1 m-1 album-img-block"> <img class="img-fluid" src="images/sqaure.jpeg" alt=""> </div> </div> </div> <div class="row align-items-center album-home-line"> <div class="col-12 col-sm-12 col-md-4 col-lg-4 px-2"> <hr /> </div> <div class="col-12 col-sm-12 col-md-4 col-lg-4 px-2"> <hr /> </div> <div class="col-12 col-sm-12 col-md-4 col-lg-4 px-2"> <hr /> </div> </div> </div> </div> </div> </div> <!-- /Content --> </div> </main> <div id="Div1" class="cityu-main"> <div class="cityu-main-inner container"> <!-- Content --> <div class="row"> <div class="col"> <div ID="AboutPanel" class="imageDetailedModalBox" onclick="CloseAbout();" style="display:none;"> <div class="aboutBox" id="aboutLayer" style="display:none;"> <p class="modalCloseP"><a onclick="CloseAbout();" class="modalClose">x</a></p> <div class="aboutAlbum"> <h2>About the Album</h2> <p>Welcome to the CityU Album! Here we showcase our diversified campus life, our cutting-edge facilities and snapshots of special moments at CityU.</p> <p>We are pleased to share these unique moments with you. But please acknowledge CityU if you use any of the images, and please don鈥檛 use them for commercial purposes. If you have any questions, please contact us at <a href="mailto:cpro@cityu.edu.hk">cpro@cityu.edu.hk</a>.</p> <p>Communications and Public Relations Office<br />City University of Hong Kong</p> </div> </div> </div> </div> </div> <!-- /Content --> </div> </div> <!-- /Main --> </form> <!-- Footer --> <footer class="cityu-footer footer-color-default"> <div class="cityu-footer-inner container" id="cityu-footer"> <!-- Bottom --> <div class="cityu-footer-bottom d-flex flex-row justify-content-between"> <!-- Info --> <div class="cityu-footer-info align-self-center"> <!-- Links --> <div class="cityu-footer-links"> <a href="https://www.cityu.edu.hk/web/privacy" rel="noopener" target="_blank">Privacy Policy</a> · <a href="https://www.cityu.edu.hk/web/copyright" rel="noopener" target="_blank">Copyright</a> · <a href="https://www.cityu.edu.hk/web/disclaimer" rel="noopener" target="_blank">Disclaimer</a> · <a href="https://www.cityu.edu.hk/web/accessibility" rel="noopener" target="_blank">Accessibility</a> </div> <!-- Copyright --> <div class="cityu-footer-copyright"> © City University of Hong Kong. All Rights Reserved. </div> </div> <!-- Logo --> <div class="cityu-footer-logo align-self-end"> <a href="https://www.cityu.edu.hk" rel="noopener" target="_blank"> <img loading="lazy" src="//template.cityu.edu.hk/template/v2/logo/CityU/CityU_Vertical_Logo_Reverse.svg" alt="City University of Hong Kong" /> </a> </div> </div> </div> </footer> <!-- Required scripts --> <script src="//template.cityu.edu.hk/template/v2/js/jquery/jquery.min.js"></script> <script src="//template.cityu.edu.hk/template/v2/js/popper.js/popper.min.js"></script> <script src="//template.cityu.edu.hk/template/v2/js/bootstrap/bootstrap.min.js"></script> <script src="//template.cityu.edu.hk/template/v2/js/cityu.base.js"></script> <!-- Optional scripts --> <script src="//template.cityu.edu.hk/template/v2/js/aos/aos.js"></script> <!-- ADD YOUR JAVASCRIPTS HERE --> <script type="text/javascript" src="js/resize.js"></script> <script type="text/javascript"> function ShowAbout() { $('#AboutPanel').attr('style', 'display: block;'); centerDialog('#aboutLayer'); return false; } function CloseAbout() { $('#AboutPanel').attr('style', 'display: none;'); $('#aboutLayer').attr('style', 'display: none;'); } function ModelPanelClick() { __doPostBack('ModelPanel', 'Click'); } var off = 91; $(document).ready(function () { resizeLayer('#layer1', off); $(window).resize(function () { resizeLayer('#layer1', off); centerDialog('#imageLayer'); centerDialog('#aboutLayer'); }); }); $(window).on("load", function () { resizeLayer('#layer1', off); centerDialog('#imageLayer'); }); </script> </body> </html>