软件工程日报（软工随笔）-编程知识

软件工程日报（软工随笔）

news/2025/3/18 23:03:23/文章来源:https://www.cnblogs.com/pygmy-killer-whale/p/18780020

今天完成了使用css,js和dom实现一个页面的基础设计：

<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>我的博客</title><link rel="stylesheet" href="myblock.css"><style>/* 按钮样式 */#mode-switch {padding: 8px 16px;border: none;background-color: white;color: #333;cursor: pointer;}

    body.dark-mode #progress-container {background-color: #555;}body.dark-mode nav {background-color: #222;}/* 错误提示样式 */.error {color: red;font-size: 12px;margin-top: 5px;}
</style>

</head> <body class="light-mode"><div id="progress-container"><div id="progress-bar"></div></div><header><nav><h1>个人博客</h1><div class="nav-links"><a href="#about">个人介绍</a><a href="#skills">我的技能</a><a href="#schedule">时间安排</a><a href="#contact">联系方式</a><button id="mode-switch">切换到黑夜模式</button></div></nav></header><div class="container"><section id="about"><h1>自我介绍</h1><p>05年社恐男大，土生土长河北人，不善言辞，没什么才艺，每天去整点零食是生活的动力，喜欢看动漫小说漫画，写过小说</p></section><section id="skills"><h2>技能储备</h2><div class="skills-grid"><div class="skill-card"><h3>烹饪大师</h3><p>擅长各类家常菜制作</p></div><div class="skill-card"><h3>前端开发</h3><p>掌握HTML/CSS基础</p></div><div class="skill-card"><h3>Java编程</h3><p>基础语法与算法实现</p></div></div></section><section id="schedule"><h2>日常节奏</h2><div class="schedule"><div class="time-slot"><span class="time">7:00</span><span>起床</span></div><div class="time-slot"><span class="time">8:00</span><span>上课</span></div><div class="time-slot"><span class="time">12:00</span><span>吃饭</span></div><div class="time-slot"><span class="time">2:00</span><span>上课</span></div><div class="time-slot"><span class="time">17:25</span><span>吃饭</span></div><div class="time-slot"><span class="time">22:00</span><span>上床睡觉</span></div></div></section><section id="contact"><h2>联系通道</h2><form class="contact - form" onsubmit="return validateForm()"><input type="text" placeholder="姓名" required><span class="error" id="name - error"></span><input type="email" placeholder="邮箱" required><span class="error" id="email - error"></span><textarea rows="4" placeholder="想说的话..." required></textarea><span class="error" id="message - error"></span><button type="submit">发送消息</button></form></section></div><script src="javascript.js"></script> </body>

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

如若内容造成侵权/违法违规/事实不符，请联系编程知识网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！