期末大作业 | ToDoList网页设计 日记本界面设计记录

最新推荐文章于 2022-07-28 00:36:18 发布
VIP文章 最新推荐文章于 2022-07-28 00:36:18 发布
阅读量1k 收藏 15
点赞数 1
分类专栏： 网页设计期末大作业 文章标签： 前端 css javascript html web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_61726211/article/details/125279794
版权

一、简要说明

为了给用户提供更多的私人空间，设计电子日志，利用table表格将日记展示出来，将图片和文字相互搭配，利用JavaScript脚本语言设计文字随日记封面变化的日记效果。

二、页面核心代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>日记本</title>
		<!-- 各个板块的样式 -->
		<link href="css/rijiben.css" rel="stylesheet" type="text/css" />
	</head>
	<body>
		<!-- 导航栏 -->
		<div>
			<ul class="to3">
				<li>TODOLIST&nbsp;|&nbsp;我欲摘星斗</li>
			</ul>
			<ul class="to1">
				<li class="to2"><a href="首页.html">首页</a></li>
				<li class="to2"><a href="番茄钟.html">番茄钟</a></li>
				<li class="to2"><a href="备忘录.html">备忘录</a></li>
				<li class="to2"><a href="倒计时.html">纪念日</a></li>
				<li class="to2"><a href="日记本.html">日记本</a></li>
				<li class="to2"><a href="关于我.html">关于我</a></li>
				<li class="to2"><a href="index.html">退出登录</a></li>
			</ul>
		</div>
		<!-- banner开头通栏 -->
		<div>
			<div class="banner">
				<!--左侧通栏-->
				<div class="left">
					<div class="content_left">
						<p class="school_en">ToDoList</p>
						<p class="school_ch">我欲摘星斗</p>
						<p class="advertise">来日纵是千千晚星，亮过今晚月亮<br>月亮从傍晚营业到深夜，一定是为了多收集些人间的秘密</p>
						<ul class="style_a">
							<li class="current"><a href="img/banner图.jpg"></a></li>
							<li class="current"><a href="img/banner图1.jpg"></a></li>
							<li class="current"><a href="img/banner图3.jpg"></a></li>
							<li class="current"><a href="img/banner图4.jpg"></a></li>
							<li class="current"><a href="img/banner图5.jpg"></a></li>
							<li class="current"><a href="img/banner图6.jpg"></a></li>
						</ul>
					</div>
				</div>
				<!--右侧通栏-->
				<div class="right">
					<div class="content_right">
						<h4>日记本<br>INTRODUCTION</h4>
						<ul class="style_icon">
							<li><a href="#"><img src="img/g4.jpg"></a></li>
						</ul>
						<br />
						<p class="cl">
							日记本是用来写日记的工具，记录一些事情，是自己的碎碎念，是自己的小灵感，也是过去的的回忆录。
						</p>
						<br />
						<p class="cl2">
							这是一种方便我们发表个人意见，记录自己日常生活的日记形式，个人写在网站专门开辟的空间，可以选择对所有公众观看阅读，也可以选择对特定观众开放的形式。
						</p>
					</div>
				</div>
			</div>
		</div>
		<!-- 登录头像 -->
		<div class="main_login">
			<div class="login_page">
				<div class="login_img">
					<img src="img/4.png" alt="image">
				</div>
				<br />
			</div>
		</div>
		<!-- 日记封面展示 -->
		<div style="width: 400px; margin: 100px 0 100px 200px;float: left">
			<ul>
				<li><img src="img/banner图.jpg" style="width: 400px;" onclick="clickme()" title="2022年1月1日"/></li><br />
				<li><img src="img/banner图1.jpg" style&
最低0.47元/天 解锁文章
IDLE不是爱豆
关注
  • 1
    点赞
  • 踩
  • 15
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
04-CGB-DB-LOG-V1.02
abu1216的博客
09-22 301
日志管理设计说明 业务设计说明 本模块主要是实现对用户行为日志(例如谁在什么时间点执行了什么操作,访问了哪些方法,传递的什么参数,执行时长等)进行记录、查询、删除等操作。其表设计语句如下： CREATE TABLE sys_logs ( id bigint(20) NOT NULL AUTO_INCREMENT, username varchar(50) DEFAULT NULL COMMENT ‘登陆用户名’, operation varchar(50) DEFAULT NULL COMMENT ‘用户
html制作一个酷炫的记事本（源码）
xcLeigh
10-26 7574
html制作一个酷炫的记事本（源码），html制作一个便签，html制作一个记事本，使用了 HTML5 的本地存储和 CSS3 等技术来创建便签。文章结尾附带html实现记事本完整源码，可以直接使用。
【微信小程序源码-毕业设计期末大作业】todolist，带简易后端.zip
05-12
微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码 微信小程序源码-毕业设计期末大作业前端项目源码
我的日记本开发手记（3）—— 布局
zhaoyang314的博客
04-06 578
配色已搞定，现在进行页面布局。那什么是布局呢？布局就是将文字、图形、图片等版面构成元素合理、有秩序地安放在限定的空间内，使页面兼具易读性和美观性，让读者产生一种舒适愉悦感，从而产生继续读下去的念头，而不是往你身上砸瓶子或者中途退场。我把目前比较流行的页面布局进行了梳理，都是一些最基本的布局。其实布局是一个仁者见仁，智者见智的一项事情，我只是大概提供给了一些自己的思路，在实际工作中，往往不是单一的布局方式，需要灵活应用，叠加多种布局方式，才能看起来爽心悦目。 1. T形布局 这种布局是目前比较常见的一种布局，
web网页设计期末课程大作业：漫画网站设计——我的英雄（5页）学生个人单页面网页作业 学生网页设计成品 静态HTML网页单页制作
HTML网页设计
07-28 1736
1网页简介此作品为学生个人主页网页设计题材，HTML+CSS布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平,非常适合初学者学习使用。2.网页编辑等任意html编辑软件进行运行及修改编辑等操作）。3.知识应用技术方面主要应用了网页知识中的Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等，视频、音频元素、Flash，同时设计了Logo（源文件）所需的知识点。......
个人写的JSP个人日记本分享学习经验
拾光博客
06-03 1735
程序介绍 本系统采用传统的Jsp+Servlet+Model的MVC开发模式，前端采用主流的BootStrap技术，数据库采用Mysql，实现了个人日记本系统，本视频教程详细讲解了次系统的完整开发，亮点是Bootstrap的综合运用，ckeditor的运用以及FileUpload组件上传图片，以及MD5加密的应用。 程序预览 程序下载 百度网盘：http...
博客网页日志页面(HTML+CSS)
小滕的Java学习旅途
12-08 4476
效果图显示 HTML+CSS代码实现 <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style type="text/css"> <!-- body,from,h1,h2,ul,li{ list-style:none; margin: 0px; padding: 0px; font-size:12.
学生HTML个人网页作业作品~蛋糕甜品店铺共11个页面(HTML+CSS+JavaScript)
热门推荐
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
07-01 3万+
学生HTML个人网页作业作品~ 个人主页博客网页设计制作~ 大学生个人网站作业模板~简单个人网页制作 ~面包店铺电商网站模板html 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~ 原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，~这是一个不错的网页制作，画面精明，非常适合初学者学习使用。 作品介绍 红色的蛋糕甜品在线预订，面包店铺电
打通大前端最后一公里之前端埋点与日志系统架构设计
React_Community的博客
04-06 4086
什么是埋点？所谓“埋点”，是数据采集领域（尤其是用户行为数据采集领域）的术语。指的是针对特定用户行为或事件进行捕获、处理和发送的相关技术及其实施过程。埋点的技术实质，是先监听软件应用运行过程中的事件，当需要关注的事件发生时进行判断和捕获。埋点的意义何在？流量监测（在线情况分析、按时段分析、按来源分析）；构建行为路径， 通过对处理后的信息进行关联，获取用户的整条行为链路；通...
html心情日志页面,增加日志页面
weixin_39633252的博客
06-05 1085
2019 年 9 月 13 日，过了一个猿宵节，花了一天多增加了一个日志页面，在本博客的左边心情栏进入。前言因为看到大神SaltyLeo的文章，觉得 3D 滚动的随笔页面还不错，就打算自己写一个，这个功能在 github 上也有源码，但是我在使用的过程中发现，这个数据源是写了一个 js 文件，以提供静态的 json 数据。于是我就想能够自己动态添加就好了，于是自己写了一个后端程序，后端管理日志的页...
html日记本
10-29
html日记本，html,css,javascrip.
日志发布系统_静态页面和数据库结构设计
08-08
日志发布系统_静态页面和数据库结构设计：包含静态页面代码，数据库结构设计，详细设计文档等。
【微信小程序-毕设期末大作业】todolist小程序，带后端源码.zip
03-19
【微信小程序-毕设期末大作业】todolist小程序，带后端源码.zip 【微信小程序-毕设期末大作业】todolist小程序，带后端源码.zip 【微信小程序-毕设期末大作业】todolist小程序，带后端源码.zip 【微信小程序-毕设...
基于ASP.NET的ToDoList的设计与实现.zip
07-04
资源包含文件：设计报告word+项目源码及数据库文件+项目截图 软件环境 ASP.NET Core v3.1 Mysql v8.x VUE v2.x Element-UI git/github NodeJS/npm Dotnet 开发环境 Macbook(苹果系统) vscode(安装c#插件) 开发环境也...
软件工程毕业设计—基于java+vue的todolist待办事项关联系统前端+后端源码.zip
06-28
软件工程毕业设计—基于java+vue的todolist待办事项关联系统前端+后端源码.已获高分通过项目。 软件工程毕业设计—基于java+vue的todolist待办事项关联系统前端+后端源码.已获高分通过项目。软件工程毕业设计—基于...
TO_DO_list_UI界面设计.sketch
12-28
TO DO list UI界面设计 oa办公、sktech、to do list、UI界面、ui界面设计
html日志网页,以HTML为表现的日志记录组件
weixin_42098104的博客
07-01 1919
关于日志记录，如果你不想随用随写，又不想用log4net的话，也许你可以了解一下这个！我也是个很懒的人，程序上的东西，只要别人写好了，而且自己用着爽，绝不做重复的coding。这个组件的起源是因为感觉log4net太强大太复杂(对我来说真是这样)，当我想用log4net的时候，看到配置我都吓尿n次了，而这个时候心中又突发奇想，用HTML来做日志的表现！理由有二，一是HTML和CSS大家都会，二是可...
试用了40+款日记APP，才知道好软件有多难求...
阿虚同学的博客
07-08 2309
本篇文章想要更好的阅读体验可以????查看原文 之前看到过一个梗 “ 正经人谁写日记啊？”，然后总觉得这话不对劲啊！？毕竟我也有写日记的习惯 于是最近才去把电影翻出来看了，实际上完整对话是讽刺写日记给别人看的老蒋的，绝对不能脱离语境单讨论这句话 雷锋、季羡林先生等…都写日记 那个年代知识分子写日记普遍到再普遍不过了，甚至被认为是好习惯，而且放到如今也是???? 总而言之，这下倒是又勾起了我的兴趣，于是今天想来写写「日记APP」这个话题 ▍1 日记APP之无敌全测试 但说实话如今日记APP可太太太太太太多
html网上日记本设计,个人博客的设计_网上日记本的开发ASP334
weixin_30275391的博客
06-04 852
第一部分 软件可行性研究与项目开发计划1. 问题定义随着时代的进步，网络技术层出不穷信息量急剧膨胀，整个人类社会已成为信息化的社会，人们对信息和数据的处理。管理和加工已经进入自动化、网络化和社会化的阶段。博客的兴起，让更多的人在网络上，建起了展示自己的空间，同时更多的人愿意在网络上，分享个人的心情日记，个人收藏，这些都是普通的博客内容。本次论文的目的制作网络日记本，我们要实现网络日记本的增加、删...
java web设计todolist
最新发布
12-30
Java Web设计Todolist的示例代码如下： ```java // 创建一个Todolist类 public class Todolist { private List<String> tasks; public Todolist() { tasks = new ArrayList<>(); } // 添加任务 public void addTask(String task) { tasks.add(task); } // 删除任务 public void deleteTask(String task) { tasks.remove(task); } // 获取所有任务 public List<String> getAllTasks() { return tasks; } } // 创建一个Servlet类 @WebServlet("/todolist") public class TodolistServlet extends HttpServlet { private Todolist todolist; @Override public void init() throws ServletException { todolist = new Todolist(); } @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // 获取所有任务并展示在页面上 List<String> tasks = todolist.getAllTasks(); request.setAttribute("tasks", tasks); request.getRequestDispatcher("todolist.jsp").forward(request, response); } @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // 添加或删除任务 String action = request.getParameter("action"); String task = request.getParameter("task"); if (action.equals("add")) { todolist.addTask(task); } else if (action.equals("delete")) { todolist.deleteTask(task); } response.sendRedirect(request.getContextPath() + "/todolist"); } } ``` 在上述代码中，我们创建了一个Todolist类来管理任务列表，包括添加任务、删除任务和获取所有任务的功能。然后，我们创建了一个Servlet类来处理HTTP请求，并将任务列表展示在一个JSP页面上。通过GET请求，我们可以获取所有任务并展示在页面上；通过POST请求，我们可以添加或删除任务。 你可以根据自己的需求进行修改和扩展，例如添加用户认证、任务优先级等功能。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值