Web大学生网页作业成品——心理健康教育介绍网页设计与实现(HTML+CSS+JS)（4个页面）

爱码网页

于 2024-09-04 09:05:59 发布

阅读量102

点赞数 4

分类专栏： html网页设计与制作学生HTML个人网页作业作品静态网页文章标签：前端 html css

本文链接：https://blog.csdn.net/weixin_42283461/article/details/141883620

版权

html网页设计与制作同时被 3 个专栏收录

46 篇文章 21 订阅

订阅专栏

学生HTML个人网页作业作品

39 篇文章 17 订阅

订阅专栏

静态网页

29 篇文章 0 订阅

订阅专栏

🎉🎉🎉 常见网页设计作业题材有**汽车、环保、明星、文化、国家、抗疫、景点、人物、体育、植物、公益、图书、节日、游戏、商城、旅游、家乡、学校、电影、动漫、非遗、动物、个人、企业、美食、婚纱、其他**等网页设计题目, 可满足大学生网页大作业网页设计需求都能满足你的需求。原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，画面精明，排版整洁，内容丰富，主题鲜明，非常适合初学者学习使用。🎉🎉🎉

一、作品介绍 🔥

🏷️本套采用HTML+CSS，使用Javacsript代码使用下拉菜单的实现以及首页图片的轮播，共有4个页面。

二、作品演示 ☁️

在这里插入图片描述

三、代码目录 🏠

在这里插入图片描述

四、网站代码 👿

HTML部分代码

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>

	<div class="header-wrapper">
		
		<div class="header">
			<div class="logo">
				<img src="./images/logo.png">
			</div>


			<ul class="nav">
				<li><a href="index.html">首页</a></li>
				<li  onmouseover="overnav(this)" onmouseout="outnav(this)"><a href="zhishi.html">心理知识</a>

					<div class="sub">
						<a href="">知识点1</a>
						<a href="">知识点2</a>
					</div>
				</li>
				<li  onmouseover="overnav(this)" onmouseout="outnav(this)"><a href="shuji.html">心理书籍</a>


					<div class="sub">
						<a href="">书籍1</a>
						<a href="">书籍2</a>
					</div>
				</li>
				<li><a href="reg.html">我要注册</a></li>
			</ul>
		</div>
	</div>

	<div class="banner-wrapper">
		
		<div class="banner">
			<img id="banner1" src="./images/b1.jpg" class="active banner_img">
			<img id="banner2" src="./images/b2.jpg" class="banner_img">
			<img id="banner3" src="./images/b3.jpg" class="banner_img">
		</div>
		<div class="index-list">
			<div id="index1" class="index active" onclick="changeIndex(1)"></div>
			<div id="index2" class="index"  onclick="changeIndex(2)"></div>
			<div id="index3" class="index" onclick="changeIndex(3)"></div>
		</div>
	</div>


	<div class="content-wrapper">
		<div class="content">
			<div class="content-title">
				<div class="content-title-name">心理健康名词解释</div>
				<div class="content-title-line"></div>
			</div>

			<div class="content-detail">
				<div class="content-detail-p">
					<p>
						个体能够适应发展着的环境，具有完善的个性特征；且其认知，情绪反应，意志行为处于积极状态，并能保持正常的调控能力。在生活实践中，能够正确认识自我，自觉控制自己，正确对待外界影响，从而使心理保持平衡协调，就已具备了心理健康的基本特征。
					</p>
					<p>
						心理健康的基本含义是指心理的各个方面及活动过程处于一种良好或正常的状态。心理健康的理想状态是保持性格完美、智力正常、认知正确、情感适当、意志合理、态度积极、行为恰当、适应良好的状态。与心理健康相对应的是心理亚健康以及心理病态。心理健康从不同的角度有不同的含义，衡量标准也有所不同。
					</p>
					<p>
						心理健康，是现代人健康不可分割的重要方面，那么什么是人的心理健康呢？人的生理健康是有标准的，人的心理健康也是有标准的。不过人的心理健康标准不及人的生理健康标准具体与客观。了解与掌握心理健康的定义对于增强与维护人们的健康有很大的意义。当人们掌握了衡量人的心理健康标准，以此为依据对照自己，进行心理健康的自我诊断。发现自己的心理状况某个或某几个方面与心理健康标准有一定距离，就有针对性地加强心理锻炼，以期达到心理健康水平。如果发现自己的心理状态严重地偏离心理健康标准，就要及时地求医，以便早期诊断与早期治疗。
					</p>
				</div>
				<div class="content-detail-img">
					<img src="./images/1.jpg">
				</div>
			</div>




			<div class="content-title">
				<div class="content-title-name">文章列表</div>
				<div class="content-title-line"></div>
			</div>


			<ul class="content-news-list">
				<li class="content-news-item">
					<a href="">研究生心理素质拓展训练营——自助助人，共同成长</a>
					<span>2022-11-29</span>
				</li>
				<li class="content-news-item">
					<a href="">“心海扬帆”辅导员心理沙龙——辅导员谈心谈话工作专题培训</a>
					<span>2022-11-28</span>
				</li>
				<li class="content-news-item">
					<a href="">心理健康教育重在“对症下药”</a>
					<span>2022-11-26</span>
				</li>
				<li class="content-news-item">
					<a href="">找准新时代学生心理健康教育突破口</a>
					<span>2022-11-23</span>
				</li>
				<li class="content-news-item">
					<a href="">学校组织全体辅导员参加全省高校辅导员心理健康教育专题培训</a>
					<span>2022-11-11</span>
				</li>
				<li class="content-news-item">
					<a href="">新生心理测评工作专题培训举办</a>
					<span>2022-11-10</span>
				</li>
				<li class="content-news-item">
					<a href="">新生“心理第一课”开讲</a>
					<span>2022-11-06</span>
				</li>
			</ul>
		</div>
	</div>

	<div class="footer-wrapper">
		<div class="footer">
			心理健康版权所有
		</div>
	</div>




</body>
</html>