day02_html5+css3+网页

今天效率略微有点低,就基本只完成了视频的任务,下午实习搞团建去了,然后被领导拉去说话了,之前因为各种面试什么的,弄得我心烦意乱,状态有些许低迷,所以进度拖的优点狠,后面不能就这么单纯的进行自己的学习计划了,还得兼顾一下公司这边的任务,不过项目对我而言应该对学习提升益处会更大的吧。

好了,报告一下今天的学习情况:尚硅谷视频 学习到了52p,盒子模型这一块学完了,之前其实了解的也挺多的,学下来感觉还不错,就是前面的选择器,常用选择器还好有经常用到,其他有一些就不是经常用到,偶尔出现的时候还是会觉得有一些的陌生,不过相信多写一写应该就还好。
以下整体目录结构:
在这里插入图片描述
负责人这边问了一下公司的进度,然后我自己的学习整体计划可能有一些更改,这是更改后的目录:
在这里插入图片描述
我自己的计划的话会跟着走,只是可能不会一天四五个小时的看了,可能就花一个小时左右跟一下进度,优先把没看的先拉入进度: jquery+ajax,再把后端挨着走吧,一天目标花费时间3-4小时左右,希望能快些赶上进度。

然后自己的毕设界面终于把导航栏调好了,没错,进度确实慢了,明天的首要任务就是把毕设界面基本完成,一些细节的东西一定一定不要这么急着去扣!!!这样太影响整体进度了!后面再来优化吧。希望明天可以顺利完成吧。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
提供的源码资源涵盖了安卓应用、小程序、Python应用和Java应用等多个领域,每个领域都包含了丰富的实例和项目。这些源码都是基于各自平台的最新技术和标准编写,确保了在对应环境下能够无缝运行。同时,源码中配备了详细的注释和文档,帮助用户快速理解代码结构和实现逻辑。 适用人群: 这些源码资源特别适合大学生群体。无论你是计算机相关专业的学生,还是对其他领域编程感兴趣的学生,这些资源都能为你提供宝贵的学习和实践机会。通过学习和运行这些源码,你可以掌握各平台开发的基础知识,提升编程能力和项目实战经验。 使用场景及目标: 在学习阶段,你可以利用这些源码资源进行课程实践、课外项目或毕业设计。通过分析和运行源码,你将深入了解各平台开发的技术细节和最佳实践,逐步培养起自己的项目开发和问题解决能力。此外,在求职或创业过程中,具备跨平台开发能力的大学生将更具竞争力。 其他说明: 为了确保源码资源的可运行性和易用性,特别注意了以下几点:首先,每份源码都提供了详细的运行环境和依赖说明,确保用户能够轻松搭建起开发环境;其次,源码中的注释和文档都非常完善,方便用户快速上手和理解代码;最后,我会定期更新这些源码资源,以适应各平台技术的最新发展和市场需求。
提供的源码资源涵盖了安卓应用、小程序、Python应用和Java应用等多个领域,每个领域都包含了丰富的实例和项目。这些源码都是基于各自平台的最新技术和标准编写,确保了在对应环境下能够无缝运行。同时,源码中配备了详细的注释和文档,帮助用户快速理解代码结构和实现逻辑。 适用人群: 这些源码资源特别适合大学生群体。无论你是计算机相关专业的学生,还是对其他领域编程感兴趣的学生,这些资源都能为你提供宝贵的学习和实践机会。通过学习和运行这些源码,你可以掌握各平台开发的基础知识,提升编程能力和项目实战经验。 使用场景及目标: 在学习阶段,你可以利用这些源码资源进行课程实践、课外项目或毕业设计。通过分析和运行源码,你将深入了解各平台开发的技术细节和最佳实践,逐步培养起自己的项目开发和问题解决能力。此外,在求职或创业过程中,具备跨平台开发能力的大学生将更具竞争力。 其他说明: 为了确保源码资源的可运行性和易用性,特别注意了以下几点:首先,每份源码都提供了详细的运行环境和依赖说明,确保用户能够轻松搭建起开发环境;其次,源码中的注释和文档都非常完善,方便用户快速上手和理解代码;最后,我会定期更新这些源码资源,以适应各平台技术的最新发展和市场需求。
好的,下面是一个简单的HTML+CSS+JS实现的日历,包含节假日的显示: HTML代码: ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>日历</title> <link rel="stylesheet" type="text/css" href="calendar.css"> </head> <body> <div class="calendar"> <div class="header"> <span class="prev" onclick="prevMonth()"><</span> <span class="date" id="date"></span> <span class="next" onclick="nextMonth()">></span> </div> <table> <thead> <tr> <th>日</th> <th>一</th> <th>二</th> <th>三</th> <th>四</th> <th>五</th> <th>六</th> </tr> </thead> <tbody id="tbody"> </tbody> </table> </div> <script src="calendar.js"></script> </body> </html> ``` CSS代码: ```css .calendar { width: 300px; margin: 20px auto; border: 1px solid #ccc; box-shadow: 0 0 5px #ccc; font-size: 14px; font-family: Arial, sans-serif; } .header { background-color: #f0f0f0; text-align: center; padding: 10px; position: relative; } .header span { cursor: pointer; } .prev { position: absolute; left: 10px; top: 10px; } .next { position: absolute; right: 10px; top: 10px; } .date { font-weight: bold; } table { width: 100%; border-collapse: collapse; } thead th { background-color: #f0f0f0; border: 1px solid #ccc; padding: 5px; text-align: center; } tbody td { border: 1px solid #ccc; padding: 5px; text-align: center; } .today { background-color: #c0c0c0; } .holiday { color: red; } ``` JS代码: ```js var date = new Date(); var year = date.getFullYear(); var month = date.getMonth() + 1; var tbody = document.getElementById("tbody"); var dateEle = document.getElementById("date"); // 获取当前月份的天数 function getDaysInMonth(year, month) { return new Date(year, month, 0).getDate(); } // 获取当前月份第一天是星期几 function getFirstDayOfWeek(year, month) { return new Date(year, month - 1, 1).getDay(); } // 获取当前月份的所有日期 function getDates(year, month) { var daysInMonth = getDaysInMonth(year, month); var firstDayOfWeek = getFirstDayOfWeek(year, month); var dates = []; for (var i = 1; i <= daysInMonth; i++) { dates.push(i); } for (var i = 0; i < firstDayOfWeek; i++) { dates.unshift(""); } return dates; } // 获取指定日期的节假日 function getHoliday(year, month, day) { var holidays = { "0101": "元旦", "0214": "情人节", "0308": "妇女节", "0312": "植树节", "0401": "愚人节", "0501": "劳动节", "0601": "儿童节", "0701": "建党节", "0801": "建军节", "0910": "教师节", "1001": "国庆节", "1224": "平安夜", "1225": "圣诞节" }; var monthStr = (month < 10 ? "0" : "") + month; var dayStr = (day < 10 ? "0" : "") + day; var dateStr = monthStr + dayStr; if (holidays[dateStr]) { return holidays[dateStr]; } return ""; } // 显示指定年月的日历 function showCalendar(year, month) { var dates = getDates(year, month); var html = ""; for (var i = 0; i < dates.length; i++) { if (i % 7 === 0) { html += "<tr>"; } var date = dates[i]; var holiday = getHoliday(year, month, date); if (holiday !== "") { html += '<td class="holiday">' + date + '<br>' + holiday + '</td>'; } else if (date !== "") { if (year === new Date().getFullYear() && month === new Date().getMonth() + 1 && date === new Date().getDate()) { html += '<td class="today">' + date + '</td>'; } else { html += "<td>" + date + "</td>"; } } else { html += "<td></td>"; } if (i % 7 === 6) { html += "</tr>"; } } tbody.innerHTML = html; dateEle.innerHTML = year + "年" + month + "月"; } // 上一个月 function prevMonth() { month--; if (month < 1) { month = 12; year--; } showCalendar(year, month); } // 下一个月 function nextMonth() { month++; if (month > 12) { month = 1; year++; } showCalendar(year, month); } // 显示当前月份的日历 showCalendar(year, month); ``` 这个日历会显示当前月份的日期,并标出当天和节假日。你可以根据自己的需要修改CSS样式和节假日数据。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值