139 lines
4.0 KiB
HTML
139 lines
4.0 KiB
HTML
<!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">
|
||
<title>Document</title>
|
||
<link href="./UI.css" rel="stylesheet" type="text/css">
|
||
<script src="./jquery-3.6.0.min.js"></script>
|
||
<script>
|
||
window.onload = function () {
|
||
getRem(750, 100)
|
||
};
|
||
window.onresize = function () {
|
||
getRem(750, 100)
|
||
};
|
||
function getRem(pwidth, prem) {
|
||
var html = document.getElementsByTagName("html")[0];
|
||
var oWidth = document.body.clientWidth || document.documentElement.clientWidth;
|
||
html.style.fontSize = oWidth / pwidth * prem + "px";
|
||
}
|
||
|
||
</script>
|
||
</head>
|
||
<body>
|
||
<a href="../index.html"><img class="log-img" src="./images/log.png"></a>
|
||
<div class="fig">
|
||
<img class="fig-img" src="./images/ui.png">
|
||
</div>
|
||
<div class="Class-star-time">
|
||
<p class="Class-start-time-p">开课时间：2022-05-22至2022-11-22</p>
|
||
</div>
|
||
<div class="content">
|
||
<div class="web">
|
||
<p class="web-p">UI/UE设计工程师</p>
|
||
<div class="web-div">
|
||
<img class="web-img" src="./images/Play.png">
|
||
<span class="web-span">试听</span>
|
||
</div>
|
||
</div>
|
||
<div class="teacher">
|
||
<p class="teacher-p">授课老师：张小北</p>
|
||
<span class="teacher-span">助教老师：王小样</span>
|
||
</div>
|
||
<div class="money"></div>
|
||
<div class="Class-time">
|
||
<div class="Duration">
|
||
<P class="Duration-p">课程时长：6个月</P>
|
||
</div>
|
||
<div class="Time">
|
||
<p class="Time-p">上课时间：全天</p>
|
||
</div>
|
||
<div class="state">
|
||
<p class="state-p">当前状态：报名中</p>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="navigation">
|
||
<div id="Course-Introduction">课程简介</div>
|
||
|
||
<div id="Audition-list">试听列表</div>
|
||
|
||
</div>
|
||
<div class="Coursediagram">
|
||
<div class="Course">
|
||
<img class="Main-image" src="./images/uicourse.png"/>
|
||
</div>
|
||
<div class="Audition-text">
|
||
<div class="list-One">
|
||
<img class="One-img" src="./images/zuoti.png">
|
||
<div class="One-div">
|
||
<span class="One-span">免费试听</span>
|
||
</div>
|
||
<p class="One-p">01 标题内容标题内容标题内容</p>
|
||
</div>
|
||
<div class="list-Two">
|
||
<img class="Two-img" src="./images/zuoti.png">
|
||
<p class="Two-p">01 标题内容标题内容标题内容</p>
|
||
</div>
|
||
<div class="list-Two">
|
||
<img class="Two-img" src="./images/zuoti.png">
|
||
<p class="Two-p">01 标题内容标题内容标题内容</p>
|
||
</div>
|
||
<div class="list-Two">
|
||
<img class="Two-img" src="./images/zuoti.png">
|
||
<p class="Two-p">01 标题内容标题内容标题内容</p>
|
||
</div>
|
||
<div class="list-Two">
|
||
<img class="Two-img" src="./images/zuoti.png">
|
||
<p class="Two-p">01 标题内容标题内容标题内容</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="Bottom-navigation">
|
||
<div class="navigation-div">
|
||
<p>关于我们</p>
|
||
<p>学习资源</p>
|
||
<p>常见问题</p>
|
||
<p>快速导航</p>
|
||
</div>
|
||
<div class="ICP">
|
||
<p class="ICP-p">ICP备案编号：京ICP备18051111号-2 版权所有：码小白训练营</p>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|
||
<script>
|
||
$(document).ready(function(){
|
||
$("#Course-Introduction").click(function(){
|
||
$(".Audition-text").hide();
|
||
|
||
});
|
||
$("#Course-Introduction").click(function(){
|
||
$(".Main-image").show();
|
||
|
||
});
|
||
});
|
||
$("#Course-Introduction").click(function(){
|
||
$("#Course-Introduction").css("color","#FF7A3E"),
|
||
$("#Audition-list").css("color","#8F8F8F")
|
||
})
|
||
</script>
|
||
<script>
|
||
$(document).ready(function(){
|
||
$("#Audition-list").click(function(){
|
||
$(".Main-image").hide();
|
||
|
||
});
|
||
$("#Audition-list").click(function(){
|
||
$(".Audition-text").show();
|
||
});
|
||
});
|
||
$("#Audition-list").click(function(){
|
||
$("#Course-Introduction").css("color","#8F8F8F"),
|
||
$("#Audition-list").css("color","#FF7A3E")
|
||
})
|
||
</script>
|