时间:2023-09-28 02:12:01 | 来源:网站运营
时间:2023-09-28 02:12:01 来源:网站运营
html制作网页案例代码----(故宫博物馆9页)特效很多:> ⛵ 源码获取 文末联系 ✈Web前端开发技术 描述 网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业 茶文化网站 | 中华传统文化题材 | 京剧文化水墨风书画 | 中国民间年画文化艺术网站 | 等网站的设计与制作 | HTML期末大学生网页设计作业,Web大学生网页
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=0"> <title>故宫博物馆</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/homecommon.css"> <link rel="stylesheet" href="css/home.css"> <script src="js/函数.js"></script> <script src="js/common.js"></script> <script src="js/home.js"></script> <script src="js/jquery.min.js"></script></head><body> <!-- 头部 --> <header> <div class="logo"></div> <div class="nav"> <ul> <li><a href="">首页</a></li> <li><a href="guide.html">导览</a><b><img src="picture/arrow1.png" alt=""></b></li> <li><a href="exhibition.html">展览</a><b><img src="picture/arrow1.png" alt=""></b></li> <li><a href="teach.html">教育</a><b><img src="picture/arrow1.png" alt=""></b></li> <li><a href="probe.html">探索</a><b><img src="picture/arrow1.png" alt=""></b></li> <li><a href="learning.html">学术</a><b><img src="picture/arrow1.png" alt=""></b></li> <li><a href="cultural.html">文创</a><b><img src="picture/arrow1.png" alt=""></b></li> <li><a href="about.html">关于</a><b><img src="picture/arrow1.png" alt=""></b></li> </ul> </div> <div class="tools"> <ul class="clear"> <li> <a href="javascript:;"><img src="picture/tools1.png" alt=""></a> <div class="show"> <a href="signin.html">登录</a> <a href="signin.html">注册</a> </div> </li> <li> <a href="javascript:;"><img src="picture/tools2.png" alt=""></a> <div class="show"> <a href="javascript:;">EN</a> <a href="javascript:;">青少版</a> </div> </li> <li> <a href="javascript:;"><img src="picture/tools3.png" alt=""></a> <div class="show"> <a href="javascript:;">搜索</a> </div> </li> </ul> <a href="#" class="tools4"> <img src="picture/tools4.png" alt=""> </a> </div> <div class="nav_child"> <div class="child c1"> <div class="nav"> <a href="javascript:;">开放时间</a> <a href="javascript:;">票务服务</a> <a href="javascript:;">交通路线</a> <a href="javascript:;">游览须知</a> <a href="javascript:;">全景故宫</a> </div> </div> <div class="child c2"> <div class="nav"> <a href="javascript:;">近期展览</a> <a href="javascript:;">专馆</a> <a href="javascript:;">原状陈列</a> <a href="javascript:;">赴外展览</a> </div> </div> <div class="child c3"> <div class="nav"> <a href="javascript:;">教育新闻</a> <a href="javascript:;">故宫讲坛</a> <a href="javascript:;">故宫博物院教育中心</a> <a href="javascript:;">国际博协培训中心</a> <a href="javascript:;">故宫志愿者</a> </div> </div> <div class="child c4"> <div class="nav"> <a href="javascript:;">建筑</a> <a href="javascript:;">藏品</a> <a href="javascript:;">古籍</a> <a href="javascript:;">宫廷历史</a> <a href="javascript:;">文物医院</a> <a href="javascript:;">文化专题</a> <a href="javascript:;">名画记</a> <a href="javascript:;">数字多宝阁</a> <a href="javascript:;">数字文物库</a> <a href="javascript:;">藏品总目</a> </div> </div> <div class="child c5"> <div class="nav"> <a href="javascript:;">学术资讯</a> <a href="javascript:;">专家名录</a> <a href="javascript:;">故宫研究院</a> <a href="javascript:;">故宫学院</a> <a href="javascript:;">其他学术机构</a> <a href="javascript:;">故宫博物院院刊</a> </div> </div> <div class="child c6"> <div class="nav"> <a href="javascript:;">故宫出版</a> <a href="javascript:;"> 文创产品</a> <a href="javascript:;"> 故宫壁纸</a> <a href="javascript:;"> 故宫APP</a> <a href="javascript:;"> 故宫游戏</a> </div> </div> <div class="child c7"> <div class="nav"> <a href="javascript:;">总说</a> <a href="javascript:;">领导资讯</a> <a href="javascript:;">院史编年</a> <a href="javascript:;">景仁榜</a> <a href="javascript:;">机构</a> <a href="javascript:;">设置</a> </div> </div> </div></header> <div class="home"> <ul> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> <ol> </ol> </div> <div class="h_w"> <div class="h_row1"> <h1>故宫博物院关于“五一”假期期间参观的温馨提示</h1> <p>“五一”假期期间,故宫博物院开馆时间从8:30提前至8:00。为了更好地提供票务服务,即日起,故宫博物院门票的开售时间从每日24时,提前至每日20时。</p> <a href="javascript:;">详细内容 <div id="line0" style="position: absolute; inset: 0px;"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="110" height="40" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); left: 0px;"><desc style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);">Created with Raphaël</desc><defs style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></defs><path fill="none" stroke="#dadada" d="M0,5L5,5L5,0L105,0L105,5L110,5L110,35L105,35L105,40L5,40L5,35L0,35L0,5" stroke-width="2" stroke-dasharray="1000,1000" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); stroke-width: 2; stroke-dashoffset: 0px; stroke-dasharray: 500, 500;"></path></svg></div> </a> </div> <div class="h_row2"> <div class="row2_col1"> <div class="row1"> <div class="new"> <h1><img src="picture/public-icon1.png" alt="">故宫 资讯<img src="picture/public-icon2.png" alt=""> <a href="javascript:;" class="a">更多 <i></i> </a> </h1> <div class="list"> <a href="javascript:;">【声明】关于故宫博物院在职、离退休人员参加社会文物鉴定等公务性活动的声明</a> <a href="javascript:;">【严正声明】关于我院依法对“故宫博物院”享有名称权和对已注册商标的商标专用权的严正声明</a> </div> <ul class="bottom"> <li>故宫博物院第九届故宫学高校教师讲习班招收学员启事 <p>03 / 17</p> </li> <li>故宫博物院关于“五一”假期期间参观的温馨提示 <p>04 / 30</p> </li> <li>故宫博物院2021年度部门预算 <p>04 / 30</p> </li> <li>“庙堂仪范——故宫博物院藏历代人物画特展(第一期) <p>04 / 30</p> </li> <li>故宫博物院陶瓷馆于“五一”武英殿开馆 <p>04 / 30</p> </li> </ul> </div> <div class="img"><img src="picture/s6084d111809d6.jpg" alt=""></div> </div> <div class="row2"> <img src="picture/s60471e6f2bc3d.png" alt=""> </div> </div> <div class="row2_col2"> <div class="row1"> <div class="col1"> <div class="h1">2021 / 5 / 2</div> <div class="h2">今日开馆</div> <div class="p"> <div class="p">除法定节假日,故宫博物院全年实行周一闭馆<strong>入馆参观需验证健康码,测体温,刷身份证</strong></div> </div> <div class="list"> <div class="li"> <h1>08:30</h1> <p>开放进馆时间</p> </div> <span></span> <div class="li"> <h1>16:00</h1> <p>止票时间<br>(含钟表馆、珍宝馆)</p> </div> <span></span> <div class="li"> <h1>16:10</h1> <p>停止入馆时间</p> </div> <span></span> <div class="li"> <h1>17:00</h1> <p>闭馆时间</p> </div> </div> </div> <div class="col2"> <div class="col2_row1"> <div class="item1"> <img src="picture/s5fae58c4971ad.png" alt=""> <div class="h">官方购票网站</div> </div> <div class="item1"> <img src="picture/s5fae58c497445.png" alt=""> <div class="h">官方购票公众号</div> </div> <div class="item2"> <div class="h1">票务咨询电话</div> <div class="p1">服务时间:8:30 — 22:00</div> <div class="t"> <span>010-85007057</span> <span>010-85007058 </span> <span>010-85007062 </span> <span>010-85007063 </span> <span>010-85007966 </span> <span>010-85007970</span> <span>010-85007967</span> <span>010-85007968</span> </div> </div> </div> <div class="slp"></div> <ul class="col2_row2"> <li><img src="picture/s5fa5319858ff0.png" alt="">导览地图</li> <li><img src="picture/s5fa531985946e.png" alt="">交通路线</li> <li><img src="picture/s5fa5319859960.png" alt="">票务服务</li> <li><img src="picture/s5fa5319859c8d.png" alt="">游览须知</li> </ul> </div> </div> <div class="box4"> <h1><img src="picture/public-icon1.png" alt="">开放 公告<img src="picture/public-icon2.png" alt=""> <a href="javascript:;" class="a">更多 <i></i> </a> </h1> <div class="list"> <a href="javascript:;">故宫博物院关于暂停城墙开放的公告</a> <a href="javascript:;">故宫博物院实行全部网络购票</a> </div> <ul class="bottom"> <li>关于承乾宫青铜器馆暂停开放的公告 <p>2021 / 04 / 27</p> </li> <li>关于故宫博物院典藏如意展恢复开放的公告 <p>2021 / 03 / 10</p> </li> <li>关于故宫博物院典藏如意展暂停开放的公告 <p>2021 / 03 / 03</p> </li> </ul> </div> </div> </div> <div class="h_row3"> <div class="box1"> <h1><img src="picture/public-icon1.png" alt="">故宫 藏品<img src="picture/public-icon2.png" alt=""></h1> <div class="num"><b>1,863,404</b> <p><img src="picture/indexicon1.png" alt=""></p> </div> <a href="javascript:;">藏品总目 <div id="line1" style="position: absolute; inset: 0px;"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="140" height="40" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); left: 0px;"><desc style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);">Created with Raphaël</desc><defs style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></defs><path fill="none" stroke="#ffffff" d="M0,5L5,5L5,0L135,0L135,5L140,5L140,35L135,35L135,40L5,40L5,35L0,35L0,5" stroke-width="2" stroke-dasharray="1000,1000" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); stroke-width: 2; stroke-dashoffset: 0px; stroke-dasharray: 500, 500;"></path></svg></div> </a> <a href="javascript:;">数字文物库 <div id="line2" style="position: absolute; inset: 0px;"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="140" height="40" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); left: 0px;"><desc style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);">Created with Raphaël</desc><defs style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></defs><path fill="none" stroke="#ffffff" d="M0,5L5,5L5,0L135,0L135,5L140,5L140,35L135,35L135,40L5,40L5,35L0,35L0,5" stroke-width="2" stroke-dasharray="1000,1000" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); stroke-width: 2; stroke-dashoffset: 0px; stroke-dasharray: 500, 500;"></path></svg></div> </a> </div> <ul class="box2"> <li><img src="picture/s60754db6220db.jpg" alt=""> <div class="mask"> <p>马远白蔷薇图页</p> <p> 宋</p> <p>纵26.2cm,横25.8cm</p> <p></p> <p class="jj">画中的白蔷薇花朵硕大,枝叶繁茂,光彩夺目。画家笔法严谨,画风清丽活泼,颇具生气,代表了南宋画院花鸟画的典型风貌。</p> </div> </li> <li><img src="picture/s60754db622db6.jpg" alt=""> <div class="mask"> <p>晴春蝶戏图页</p> <p> 宋</p> <p>纵23.7cm,横25.3cm</p> <p></p> <p class="jj">图绘体态多姿的凤蝶、娇小素净的粉蝶等各种蝴蝶,在明媚的春光下宛若俏丽的花团漫天绽放,形象生动地体现出蝶戏的创作主题。</p> </div> </li> <li><img src="picture/s60754db620cb3.jpg" alt=""> <div class="mask"> <p>碧桃图页</p> <p> 宋</p> <p>纵24.8厘米,横27厘米</p> <p></p> <p class="jj">图中盛开的碧桃红白相映,枝叶扶疏,娇柔妩媚。虽然画面上仅绘桃花两枝,但它的繁花簇簇、苞蕾盈枝则透露出浓郁的春意。</p> </div> </li> </ul> </div> <div class="h_row4"> <div class="row1"> <h1><img src="picture/public-icon1.png" alt=""> 博物馆活动<img src="picture/public-icon2.png" alt=""></h1> <ul class="box3"> <li> <h3>【讲座报道】朱玉麒:从燕然山到大成殿——西北边疆平定的纪功碑——故宫研究院学术讲坛第八十二讲</h3> <p>2021年4月21日下午,杭州大学历史学系暨中国古代史研究中心教授朱玉麒先生在故宫博物院第二会议...</p> </li> <li> <h3>《(新编)中国通史》清代(上)卷、中国历史图录卷 编纂工作正式启动</h3> <p>《(新编)中国通史》是党中央在中国特色社会主义进入新时代,中华民族迎来全面建成小康社会,实现第一...</p> </li> <li> <h3>国际古迹遗址日中国主题活动“我在故宫画彩画——听障青少年走进文化遗产地”顺利举行</h3> <p>2021年4月18日上午,由国家文物局指导,中国古迹遗址保护协会、故宫博物院、中国听力语言康复研...</p> </li> <li> <h3>【讲座报道】王旭东院长:“敦煌与故宫——中华文化包容互鉴的结晶” ——2021年北大故宫系列学术讲座隆重开启</h3> <p>2021年4月9日晚,在这春意盎然的美好日子里,故宫博物院院长王旭东做客杭州大学,举办主题为“敦...</p> </li> </ul> </div> <div class="row2"> <img src="picture/s608b636e07539.jpg" alt=""> </div> </div> <ul class="h_row5"> <li><img src="picture/s5ebe364fa24bd.jpg" alt=""> <div class="cont"><img src="picture/s5863704a46b10.png" alt=""> <p>图书馆</p> </div> <div class="mask"></div> </li> <li><img src="picture/s5835a58eb4421.jpg" alt=""> <div class="cont"><img src="picture/s58636fe246e0a.png" alt=""> <p>视听馆</p> </div> <div class="mask"></div> </li> <li><img src="picture/s5835a57aca965.jpg" alt=""> <div class="cont"><img src="picture/s58bcfc20c5076.png" alt=""> <p>数字文物库</p> </div> <div class="mask"></div> </li> <li><img src="picture/s5f86a1c4afbf6.jpg" alt=""> <div class="cont"><img src="picture/s58bcfc33c893d.png" alt=""> <p>全景故宫</p> </div> <div class="mask"></div> </li> <li><img src="picture/s5835a57aca965.jpg" alt=""> <div class="cont"><img src="picture/s58bcfc4e63ba3.png" alt=""> <p>V故宫</p> </div> <div class="mask"></div> </li> </ul> </div> <div class="sidebar"> <ul class="sidebar_ul"> <li> <a href="javascript:;"></a> </li> <li> <a href="javascript:;">常</a> <div class="box"><i>年</i> · <i>庆</i> · <i>博</i> · <i>春</i> · <i>夏</i> · <i>秋</i> · <i>冬</i> · <i>常</i></div> </li> <li> <a href="javascript:;">享</a> <div class="box"><img src="picture/share-icon1.png" alt=""><img src="picture/share-icon2.png" alt=""></div> </li> <li> <a href="javascript:;">书</a> <div class="box">图书馆</div> </li> <li> <a href="javascript:;">听</a> <div class="box">视听馆</div> </li> <li> <a href="cultural.html">创</a> <div class="box">文创馆</div> </li> <li> <a href="javascript:;">景</a> <div class="box">全局故宫</div> </li> <li> <a href="javascript:;">VR</a> <div class="box">V故宫</div> </li> <li> <a href="javascript:;">云</a> <div class="box">云游故宫</div> </li> <li> <a href="signin.html">登</a> <div class="box">会员登录</div> </li> <li> <a href="javascript:;"></a> <div class="box">调查问卷</div> </li> </ul> <div class="sidebar_x"></div> </div> <!-- 底部 --> <div class="footer"> <div class="num">网站访问量<span><i>1</i><i>3</i><i>1</i><i>7</i><i>7</i><i>3</i><i>8</i><i>8</i><i>0</i></span></div> <div class="nav_foot"> 网站地图 相关链接 影像授权 隐私政策 版权声明 在线咨询 联系我们 关于我们 调查问卷 </div> <div class="row1">网站维护:故宫博物院资料信息部 联系方式:gugong@dpm.org.cn</div> <div class="row2"><img src="picture/ico.png" alt=""> 京公网安备 11010102004165号 京ICP备05067311号-1</div> <div class="row3">© 2001- 现在 故宫博物院 网站建设: 杭州分形科技</div> <div class="jy">浏览建议</div> <div class="row4"> <div class="col"> <div class="col3"></div> </div> <div class="col2"></div> </div> </div></body></html>
关键词:故宫,博物馆