基于HTML+CSS制作感恩,传统节日,感恩节【网页设计】

一、👨‍🎓网站题目


🥧 感恩、🍰传统节日、🦐地方美食小吃文化、🍺餐饮文化、等网站的设计与制作。

二、✍️网站描述

🍧感恩主题网站 主要对各种感恩进行展示,让浏览者清晰地了解到各种感恩的详细信息,便于浏览者进行选择。

👨‍🎓静态网站的编写主要是用HTML DIV+CSS JS等来完成页面的排版设计👩‍🎓,常用的网页设计软件有Dreamweaver、EditPlus、HBuilderX、VScode 、Webstorm、Animate等等,用的最多的还是DW,当然不同软件写出的前端Html5代码都是一致的,本网页适合修改成为各种类型的产品展示网页,比如美食、旅游、摄影、电影、音乐等等多种主题,希望对大家有所帮助。

三、📚网站介绍

📔网站布局方面:计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。

📓网站程序方面:计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器,已达到打开后就能即时看到网站的效果。

📘网站素材方面:计划收集各大平台好看的图片素材,并精挑细选适合网页风格的图片,然后使用PS做出适合网页尺寸的图片。

📒网站文件方面:网站系统文件种类包含:html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件;

📙网页编辑方面:网页作品代码简单,可使用任意HTML编辑软件(如:Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作)。
其中:
(1)📜html文件包含:其中index.html是首页、其他html为二级页面;
(2)📑 css文件包含:css全部页面样式,文字滚动, 图片放大等;
(3)📄 js文件包含:js实现动态轮播特效, 表单提交, 点击事件等等(个别网页中运用到js代码)。

四、🌐网站效果

 

五、🪓 代码实现

🧱HTML结构代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>感恩</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="css/style.css" rel="stylesheet" type="text/css" />
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table id="main" width="1200" border="0" cellpadding="0" cellspacing="0">

    <tr>
        <td id="menu">
            <table cellpadding="0" cellspacing="0">
                <tr>
                    <td><a href="1.html">首页</a></td>
                    <td><a href="qiyuan.html">起源</a></td>
                    <td><a href="xingcheng.html">形成</a></td>
                    <td><a href="biaoxian.html">表现</a></td>
                    <td><a href="liuyan.html">登录</a></td>         
                </tr>
            </table>
        </td>
    </tr>
    <tr>
    
        <td id="content">
            <p>“感恩“是积极心理学中一个重要的特质,指的是对生活中美好事物的感激和欣赏。一般意义上的解释为“对别人的帮助给予感激”。推而广之,感恩是对外界施予自己的恩惠和自己给予自己的恩惠表示物质上或是精神上的感谢。

    人的一生,离不开他人的关爱与帮助,“滴水之恩,当涌泉相报”就是一种典型的感恩心理,也是珍贵人格品质的体现,对他人说一声“谢谢”显得格外重要。

      同样,酸甜苦辣的生活既会有顺心如意,也有挫折困境。有时,面对压力是历练自己坚强品质的机会。看到自己的付出和勇气、肯定“我尽了自己最大的努力”也是一种感恩,对自己说一声“谢谢”非常重要。1.积极的欣赏和肯定你爱的人

    积极的欣赏即是有意识地去发现对方身上那些好的品质,比如善良、体贴、优雅或特长,并且大声地告诉对方,这样做可以“增加对彼此关系中积极事物的认识“。如果同时能再注重细节的话,比如关注到每个人每天表现出来的不太一样的闪光点,对彼此关系的促进就会更强了。

     感恩能让我们更多地参与到生活中去,并提醒我们有些美好的事情并不是我们所认为的理所当然。当我们尝试多挖掘一些生活中的温暖画面,并充分表达时,如”谢谢你和我一起去食堂吃早餐,一路聊天很愉快“,我们的快乐也许会增添很多。

    2.认识到什么是“足够好”


        </td>
    </tr>
        <tr>
        <td>
        <table width="1200" border="0" id="zi">
  <tr>
    <td >&nbsp;</td>
  </tr>
  <tr>
    <td><img src="image/q.jpg" width="590" height="100">
    </td>
    <td >&nbsp;</td>
    <td><p>    有时,我们会因执着于追求自己心中的完美标准,容易为一些小事而烦恼,进而对他人的评价也是批评多过赞美。虽然这并不意味着应该一味忍让,但可以尝试尽力和对方达成共识,或者可以允许和而不同共存。

     因此,不管是对自己琮是在与人相处中,建议大家尽量去认识到自己和对方已经做得“足够好”了,即使并不完全如心愿,但如果已经尽了最大努力,那么“少关注细节,多关注自己/对方”才是最明智的选择。

     积极心理学中的“感恩”强调感激和欣赏发生在你身上的美好的事情,懂得知足,这是一种喜悦、平和的感受,并不需要伴有自责和内疚感。

    3.练习内在的和外在的感恩
</td>
        <div class="qb_1">
            <div class="qb_1_2">
            <P>    感恩这种积极情感其实很容易获得,坚持做简单的练习就能持续提升幸福感,将感恩变为一种习惯。

    可以从‘内心的感恩’开始,先私下里表达对自己的感激之情。比如每天或每周写一篇感恩日记,提醒自己生活中的美好事物。不要只对那些显而易见的、重要的事情表达感激之情,“真正快乐的人会对一些微不足道的小事表达感谢之情。” 

    接着可以“把内在感恩转向‘外在的感恩’,将你的感激之情表达出来”。向身边值得的人表达你的感激之情,永远也不要低估你的表达给他人带去的积极影响。</p>
</P>
            </div>
        </div>


</body>
</html>
💒CSS样式代码
@charset "utf-8";
*{margin:0; padding:0; list-style-type:none;}
body{font-size:14px; background:#f5f4d8;}
a img{border:none;}
.clear{clear:both;}
#main{width:1200px; margin:0 auto;}
#menu{background:#7c5a3f; height:40px;}
#menu a{color:#fff; text-decoration:none;}
#menu a:hover{text-decoration:underline;}
#menu table{width:1200px;}
#menu table td{text-align:center;}
#content{background:#fff; line-height:30px; padding:20px;}
#content p{text-indent:30px;}
#zi{margin-top:10px;background:#fff; line-height:30px;}
#zi span{margin-left:20px; color:#FFF}
#zi p{ padding:20px;}
#footer{background:#ddd; text-align:center; color:#000; padding:20px 0;}

六、🥇 如何让学习不再盲目

很多刚入门编程的小白学习了基础语法,却不知道语法的用途,不知道如何加深映像,不知道如何提升自己,这个时候每天刷自主刷一些题就非常重要(百炼成神),可以去牛客网上的编程初学者入门训练。该专题为编程入门级别,适合刚学完语法的小白练习,题目涉及编程基础语法,基本结构等,每道题带有练习模式和考试模式,可还原考试模式进行模拟,也可通过练习模式进行练习。

七、🎁更多干货

1.如果我的博客对你有帮助、如果你喜欢我的博客内容,请 “👍点赞” “✍️评论” “💙收藏” 一键三连哦!

2.💗【👇🏻👇🏻👇🏻关注我| 获取更多源码 | 优质文章】 带您学习各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者,一起探讨 前端 Node 知识,互相学习」!

3.以上内容技术相关问题💌欢迎一起交流学习👇🏻👇🏻👇🏻🔥源代码:
QQ:3021557545

绿泡泡:XiaoMei_NN

4.有任何意见或者不懂得地方可以在评论区留言,也可以私信,我会认真看也会回复的哦

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/672596.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

c++初试

c初试 字符串的使用和bool类型 定义自己的命名空间my_sapce&#xff0c;在my_sapce中定义string类型的变量s1&#xff0c;再定义一个函数完成对字符串的逆置。 #include <iostream>using namespace std; namespace my_sapce {string s1 "abcdefg";void Inve…

基于字典树可视化 COCA20000 词汇

COCA20000 是美国当代语料库中最常见的 20000 个词汇&#xff0c;不过实际上有一些重复&#xff0c;去重之后大概是 17600 个&#xff0c;这些单词是很有用&#xff0c;如果能掌握这些单词&#xff0c;相信会对英语的能力有一个较大的提升。我很早就下载了这些单词&#xff0c;…

CPVT(ICLR 2023)论文解读

paper&#xff1a;Conditional Positional Encodings for Vision Transformers official implementation&#xff1a;GitHub - Meituan-AutoML/CPVT 存在的问题 位置编码的局限性&#xff1a;传统Transformer中的绝对位置编码&#xff08;无论是可学习的还是固定的&#xff…

“世界酒中国菜”系列活动如何助推乡村振兴和文化交流?

"世界酒中国菜"系列活动如何助推乡村振兴和文化交流&#xff1f; 《经济参考报》&#xff08;2024年5月24日 第6版&#xff09; 新华社北京&#xff08;记者 张晓明&#xff09; “世界酒中国菜”系列活动自启动以来&#xff0c;已在国内外产生了广泛影响。这一国家…

6,串口编程———通过串口助手发送数据,控制led亮灭

//功能&#xff1a;串口助手每次发送数据格式&#xff1a;0000& // 第二个字节控制LED1亮灭 // 第三个字节控制LED2亮灭 // 第四个字节控制LED3亮灭 // 第无个字节控制LED4亮灭 //要求&#xff1a;代码能够一直运行&#xff0c;能够接收多字节数据 上节讲了串口的基本…

生态融合促发展 YashanDB与丰图科技完成兼容性认证

近日&#xff0c;深圳计算科学研究院崖山数据库系统YashanDB V23与丰图科技智域城市数字孪生平台顺利完成兼容性互认证。经严格测试&#xff0c;双方产品完全兼容&#xff0c;稳定运行&#xff0c;充分满足企事业单位在高性能、高可用性、高稳定性及高可控性方面的核心需求&…

【Linux系统编程】冯诺依曼体系、操作系统、进程的认识

目录 一、认识冯诺依曼体系 二、认识操作系统 三、认识进程 一、认识冯诺依曼体系 我们日常使用的计算机&#xff0c;笔记本和我们不常见的计算机如服务器&#xff0c;它们都遵循冯诺依曼体系。 下图是冯诺依曼体系结构的图解&#xff1a; 我们可以看到冯诺依曼体系结构由…

String,StringBuffer ,StringBuilder 的区别及其详解

目录 一、String1.1 String介绍1.2 深入理解String的不可变性1.3 String 操作字符串方法 二、StringBuffer2.1 StringBuffer介绍2.2 StringBuffer 构造方法2.3 StringBuffer 常用方法 三、StringBuilder2.1 StringBuffer介绍 四、String&#xff0c;StringBuffer &#xff0c;S…

MySQL中的redo log 和 undo log

undo log和redo log 先引入两个概念&#xff1a; 当我们做了一些操作 (update/delete/insert)&#xff0c;提交事务后要操作MySql中的数据。 为了能够提升性能&#xff0c;引入了两块区域&#xff1a;内存结构和磁盘结构。 磁盘结构&#xff1a; 主要存储的就是数据页&#x…

OSG学习记录

osg开发配置与第一个osg程序-CSDN博客 #include <osg/Geode> #include <osg/ShapeDrawable> #include <osgViewer/Viewer> #include <iostream>int main(int argc, char** argv) {std::cout << "Hello, osg!" << std::endl;osg:…

【Qt系列教程】一、认识Qt、安装Qt、运行Hello Qt

文章目录 1.1 Qt 简介1.2 Qt 的安装1.3 编写 Hello World 1.1 Qt 简介 Qt&#xff08;官网&#xff1a;https://www.qt.io&#xff09;于1995年5月首次公开发布&#xff0c;是一个跨平台的应用程序开发框架&#xff0c;也是最主流的 C 开发框架&#xff1b; Qt 具有其他编程…

Windows安装Kibana7.17.0

安装 Kibana 是通过下载 Kibana 压缩包并解压&#xff0c;然后进行简单的配置即可。以下是在 Windows 系统上安装 Kibana 的基本步骤&#xff1a; 1. 下载 Kibana 访问 Elastic 官网的下载页面&#xff0c;选择适用于你系统的 Kibana 版本进行下载。根据你的系统选择 Windows…

【Linux】进程间通信(System V IPC)

这节我们开始学习System V IPC方案。 分别是共享内存&#xff0c;消息队列与信号量 会着重讲解共享内存&#xff0c;但是消息队列与信号量只会说明一下原理。 原因&#xff1a;System V是新设计的一套标准 与文件的整合度不高只能进行本地通信 更何况&#xff0c;我们现在有…

【30天精通Prometheus:一站式监控实战指南】第15天:ipmi_exporter从入门到实战:安装、配置详解与生产环境搭建指南,超详细

亲爱的读者们&#x1f44b;   欢迎加入【30天精通Prometheus】专栏&#xff01;&#x1f4da; 在这里&#xff0c;我们将探索Prometheus的强大功能&#xff0c;并将其应用于实际监控中。这个专栏都将为你提供宝贵的实战经验。&#x1f680;   Prometheus是云原生和DevOps的…

flink Jobmanager metaspace oom 分析

文章目录 现象作业背景分析现象分析类卸载条件MAT 分析 解决办法flink 官方提示 现象 通过flink 页面提交程序&#xff0c;多次提交后&#xff0c;jobmanager 报metaspace oom 作业背景 用户代码是flink 代码Spring nacos 分析 现象分析 从现象来看肯定是因为有的类没有被…

[学习笔记](b站视频)PyTorch深度学习快速入门教程(绝对通俗易懂!)【小土堆】(ing)

视频来源&#xff1a;PyTorch深度学习快速入门教程&#xff08;绝对通俗易懂&#xff01;&#xff09;【小土堆】 前面P1-P5属于环境安装&#xff0c;略过。 5-6.Pytorch加载数据初认识 数据文件: hymenoptera_data # read_data.py文件from torch.utils.data import Dataset …

RabbitMQ-直连交换机(direct)使用方法

RabbitMQ-默认读、写方式介绍 RabbitMQ-发布/订阅模式 目录 1、概述 2、直连交换机 3、多重绑定 4、具体代码实现 4.1 生产者部分 4.2 消费者部分 5、运行代码 6、总结 1、概述 直连交换机&#xff0c;可以实现类似路由的功能&#xff0c;消息从交换机发送到哪个队列…

使用低代码系统的意义与价值主要体现在哪里?

使用低代码系统的意义与价值主要体现在以下几个方面&#xff0c;这些观点基于驰骋低代码设计者的专业洞察和行业经验&#xff1a; 快速原型创建&#xff1a; 低代码平台通过提供图形化界面和预构建的模块&#xff0c;极大地加速了系统原型的创建过程。这意味着企业能够更快地验…

Aras Innovator-Team(群组)的使用方法

当Aras Innovator在处理权限时&#xff0c;在不使用Team的情况下&#xff0c;系统的权限配置可以满足大部分业务场景&#xff0c;如&#xff1a;常见的按照组织架构&#xff0c;成员和角色分配权限&#xff0c;按照生命周期分配权限等。 如果遇到比较复杂的权限需求&#xff0c…

Docker安装启动Mysql

1、安装Docker&#xff08;省略&#xff09; 网上教程很多 2、下载Mysql5.7版本 docker pull mysql:5.7 3、查看镜像是够下载成功 docker images 4、启动镜像&#xff0c;生成容器 docker run --name mysql5.7 -p 13306:3306 -e MYSQL_ROOT_PASSWORD123456 -d mysql:5.7 5…