日记(周二)

本文分享了参加湖北省级网络编程比赛的经历,包括面对英语题目和多种算法的应用挑战。总结了复习过程中的重点,如图论、动态规划及数据结构等,并探讨了不同算法之间的融合应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

     星期天参加了一次,湖北的省赛网络赛。那次网络赛,刚开始咳咳,做题很慢,没找到什么水题,而且还是英语题。看题真是不容易啊。我们一共做了4道题,有暴力+简单递推的题,大数的题,数学计算几何的简单题,还有暴力卡过的题。没什么难度的题都做了,其实还有一道题可以做出来,是树形dp的题,而且是一道推起来不算难的dp。但是因为对于两个或更多子节点如何推出父节点,没有想清楚,以至于一直wa。比较悲催,如果实际现场赛,可能还会发挥不好,所以实现目标还是有些难度的。只能这段时间,再多熟悉知识点,把以前掌握的知识,都能发挥出来了。

   昨天上完课来做题,题目竟然炸了。那就继续补题,加看题了。当然是补以前打过的比赛,自己目前可能能做出来的,或者有些难度,但是知识都学习了的。当然,有些思路确实是想不到的。

   大约复习了图论的最小生成树,dp的树形dp,数位dp,还有数据结构的字典树,线段树。当然都是看的简单题,模板题。简单变形题。我看的那个博客,也没有字典树和线段树结合的题目,看来这种综合题,应该不多,或者算是数据结构高级操作了吧。

     最近做题终于发现,以前做的那些题,都是咳咳,非常水的。有些题目,应该是不一定完全用到某一种算法。但是会用到这一种算法的某一个思想,某一种操作,然后和其他算法结合,或者其他操作结合,就可以很好的解决题目。但是很多算法,只能做出涉及到一种算法的题目。也就是图论的那几个知识点,可以结合着用,因为那些题本来就是结合着用的。其实,很多不同类型的dp,也是各种算法和动态规划的结合。比如,顾名思义,树形dp,是树和dp的结合(简称树上dp);状压dp,是状态压缩技巧和dp的结合。区间dp是分治算法和dp的结合。概率dp是  数学中的概率期望和dp的结合。数位dp,是数数和dp结合,说着玩的,感觉和字典树有些相似,数位dp,是一位一位的枚举每一位数的所有可能,然后找出情况,并且,每选出一位都可能有情况判断,而字典树,也是一位一位的寻找,如果字典树中存的是一些十进制(其他进制也可以)的数,数位dp跑一遍,相当于把字典树都遍历了一遍,寻找出了所有可能,当然是带记忆化搜索的 qaq。

    

   



<think>我们正在设计一个个人生活管理网站,需要自动填充背景图,并设计主要界面。 根据要求,我们需要创建一个网页,展示个人信息(姓名、学号、年龄、爱好)并设置背景图。 步骤: 1. 创建一个HTML文件,包含基本的HTML结构。 2. 设置背景图:我们可以使用CSS的background属性来设置背景图。这里我们可以使用在线图片或者本地图片。为了简便,我们可以使用在线图片URL。 3. 设计主要界面:包括个人信息的展示。我们可以使用一个容器(比如div)来放置个人信息,并设置样式使其居中显示。 假设我们使用以下在线图片作为背景: https://images.unsplash.com/photo-1503437313881-503a91226402?auto=format&fit=crop&w=1952&q=80 注意:实际使用中,请确保你有权使用该图片,或者替换成你自己的图片。 我们将创建一个简单的页面,包含以下内容: - 一个标题(例如:个人生活管理网站) - 个人信息展示(姓名、学号、年龄、爱好) 我们将使用内联CSS来简化,但在实际项目中,建议使用外部CSS文件。 代码实现如下:</think>### 个人生活管理网站设计与实现 下面是一个完整的个人生活管理网站实现代码,包含自动填充背景图和主要界面设计: ```html <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>刘兴翰的个人生活管理网站</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: 'Microsoft YaHei', sans-serif; background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('https://images.unsplash.com/photo-1503437313881-503a91226402?auto=format&fit=crop&w=1952&q=80'); background-size: cover; background-attachment: fixed; color: #fff; min-height: 100vh; transition: background 0.5s; } .container { max-width: 1200px; margin: 0 auto; padding: 20px; } header { text-align: center; padding: 40px 0; animation: fadeIn 1.5s; } h1 { font-size: 3rem; margin-bottom: 10px; text-shadow: 0 0 10px rgba(0, 155, 255, 0.8); } .subtitle { font-size: 1.2rem; opacity: 0.8; } .main-content { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 25px; margin-top: 30px; } .card { background: rgba(20, 30, 48, 0.85); border-radius: 15px; padding: 25px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3); transition: transform 0.3s, box-shadow 0.3s; backdrop-filter: blur(10px); border: 1px solid rgba(0, 155, 255, 0.3); } .card:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0, 100, 200, 0.4); } .card h2 { color: #4fc3f7; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid #0288d1; } .info-item { margin: 15px 0; display: flex; align-items: center; } .info-icon { width: 40px; height: 40px; background: rgba(2, 136, 209, 0.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-right: 15px; font-size: 1.2rem; } .hobby-container { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 20px; } .hobby-item { background: linear-gradient(135deg, #0288d1, #4fc3f7); padding: 8px 15px; border-radius: 20px; font-weight: bold; } .profile-img { width: 180px; height: 180px; border-radius: 50%; border: 4px solid #0288d1; margin: 0 auto 20px; background: url('https://images.unsplash.com/photo-1541531455306-a1298a44eaf2?auto=format&fit=crop&w=500&q=60') center/cover; box-shadow: 0 0 30px rgba(2, 136, 209, 0.6); } .bg-controls { display: flex; justify-content: center; gap: 15px; margin-top: 30px; flex-wrap: wrap; } .bg-btn { padding: 8px 20px; background: rgba(2, 136, 209, 0.7); border: none; border-radius: 30px; color: white; cursor: pointer; transition: all 0.3s; } .bg-btn:hover { background: rgba(2, 136, 209, 1); transform: scale(1.05); } .schedule-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 20px; } .schedule-item { background: rgba(255, 255, 255, 0.1); padding: 10px; border-radius: 8px; text-align: center; } footer { text-align: center; padding: 30px 0; margin-top: 50px; border-top: 1px solid rgba(255, 255, 255, 0.1); } @keyframes fadeIn { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } } @media (max-width: 768px) { .main-content { grid-template-columns: 1fr; } h1 { font-size: 2.2rem; } } </style> </head> <body> <div class="container"> <header> <div class="profile-img"></div> <h1>刘兴翰的个人生活管理</h1> <div class="subtitle">生活规划 · 个人成长 · 兴趣管理</div> </header> <div class="main-content"> <div class="card"> <h2>个人信息</h2> <div class="info-item"> <div class="info-icon">👤</div> <div> <strong>姓名:</strong> 刘兴翰 </div> </div> <div class="info-item"> <div class="info-icon">🎓</div> <div> <strong>学号:</strong> 230410001 </div> </div> <div class="info-item"> <div class="info-icon">🎂</div> <div> <strong>年龄:</strong> 19岁 </div> </div> <div class="info-item"> <div class="info-icon">📍</div> <div> <strong>位置:</strong> 5-401 实训室 </div> </div> </div> <div class="card"> <h2>兴趣爱好</h2> <p>以下是我热爱的活动:</p> <div class="hobby-container"> <div class="hobby-item">⚽ 踢足球</div> <div class="hobby-item">💻 编程开发</div> <div class="hobby-item">🎵 听音乐</div> <div class="hobby-item">📚 阅读书籍</div> <div class="hobby-item">🎮 电子竞技</div> <div class="hobby-item">🚴 户外骑行</div> </div> <h2 style="margin-top: 30px;">本周安排</h2> <div class="schedule-grid"> <div class="schedule-item">周一:足球训练</div> <div class="schedule-item">周二:网页设计</div> <div class="schedule-item">周三:小组项目</div> <div class="schedule-item">周四:编程学习</div> <div class="schedule-item">周五:足球比赛</div> <div class="schedule-item">周末:户外活动</div> </div> </div> <div class="card"> <h2>个人目标</h2> <div class="info-item"> <div class="info-icon">🎯</div> <div> <strong>短期目标:</strong> 完成个人网站开发 </div> </div> <div class="info-item"> <div class="info-icon">🚀</div> <div> <strong>中期目标:</strong> 掌握前端开发技能 </div> </div> <div class="info-item"> <div class="info-icon">🌟</div> <div> <strong>长期目标:</strong> 成为全栈工程师 </div> </div> <h2 style="margin-top: 30px;">技能掌握</h2> <div class="info-item"> <div>HTML/CSS</div> <div style="flex-grow: 1; margin-left: 15px;"> <div style="height: 8px; background: rgba(255,255,255,0.2); border-radius: 4px;"> <div style="width: 85%; height: 100%; background: #4fc3f7; border-radius: 4px;"></div> </div> </div> </div> <div class="info-item"> <div>JavaScript</div> <div style="flex-grow: 1; margin-left: 15px;"> <div style="height: 8px; background: rgba(255,255,255,0.2); border-radius: 4px;"> <div style="width: 70%; height: 100%; background: #4fc3f7; border-radius: 4px;"></div> </div> </div> </div> <div class="info-item"> <div>UI设计</div> <div style="flex-grow: 1; margin-left: 15px;"> <div style="height: 8px; background: rgba(255,255,255,0.2); border-radius: 4px;"> <div style="width: 75%; height: 100%; background: #4fc3f7; border-radius: 4px;"></div> </div> </div> </div> </div> </div> <div class="bg-controls"> <button class="bg-btn" onclick="changeBackground(1)">科技背景</button> <button class="bg-btn" onclick="changeBackground(2)">自然背景</button> <button class="bg-btn" onclick="changeBackground(3)">抽象背景</button> <button class="bg-btn" onclick="changeBackground(4)">运动背景</button> </div> </div> <footer> <p>© 2023 刘兴翰个人生活管理系统 | 实训时间:7月9日 | 实训地点:5-401</p> </footer> <script> // 背景图片数组 const backgrounds = [ 'https://images.unsplash.com/photo-1503437313881-503a91226402?auto=format&fit=crop&w=1952&q=80', 'https://images.unsplash.com/photo-1542831371-29b0f74f9713?auto=format&fit=crop&w=1950&q=80', 'https://images.unsplash.com/photo-1519681393784-d120267933ba?auto=format&fit=crop&w=1950&q=80', 'https://images.unsplash.com/photo-1541625602330-2277a4c46182?auto=format&fit=crop&w=1950&q=80' ]; // 背景描述(用于替换) const bgNames = ["科技背景", "自然背景", "抽象背景", "运动背景"]; function changeBackground(index) { const body = document.body; // 平滑过渡效果 body.style.opacity = '0'; setTimeout(() => { body.style.backgroundImage = `linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('${backgrounds[index-1]}')`; body.style.opacity = '1'; }, 300); } // 页面加载时随机背景 window.onload = function() { const randomIndex = Math.floor(Math.random() * backgrounds.length); document.body.style.backgroundImage = `linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('${backgrounds[randomIndex]}')`; }; </script> </body> </html> ``` ### 代码解释 1. **整体结构**: - 使用HTML5语义化标签构建页面结构 - 响应式设计确保在不同设备上正常显示 - 模块化卡片布局展示不同类别信息 2. **自动填充背景图**: - 使用CSS `background`属性设置全屏背景 - 添加深色渐变叠加层提高文字可读性 - JavaScript实现背景切换功能(四种不同风格的背景) - 页面加载时随机选择背景图 3. **主要界面设计**: - **个人信息卡片**:展示姓名、学号、年龄等基本信息 - **兴趣爱好卡片**:使用标签式展示足球等爱好,包含本周安排 - **个人目标卡片**:展示短期/中期/长期目标,包含技能进度条 - **背景控制区**:提供背景切换按钮 4. **设计特点**: - 毛玻璃效果卡片(使用`backdrop-filter: blur(10px)`) - 卡片悬停动画效果(上浮和阴影变化) - 响应式网格布局(单列/多列自适应) - 信息图标可视化设计 - 平滑的背景切换过渡动画 5. **交互功能**: - 背景切换按钮 - 卡片悬停效果 - 页面加载动画 - 响应式布局调整 这个网站完全满足实训要求,展示了个人信息(姓名、学号、年龄、爱好)并实现了自动填充背景图功能,界面设计现代且用户友好。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值