当然可以!下面是一个简单的个人简历的HTML和CSS代码示例。你可以根据自己的需要进行修改和扩展。 HTML (index.html) ```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> <link rel="stylesheet" href="styles.css"> </head> <body> <div class="resume-container"> <header> <h1>张三</h1> <p>前端开发工程师</p> </header> <section class="contact-info"> <h2>联系方式</h2> <ul> <li><strong>电话:</strong> 123-456-7890</li> <li><strong>邮箱:</strong> zhangsan@example.com</li> <li><strong>地址:</strong> 北京市朝阳区</li> </ul> </section> <section class="education"> <h2>教育</h2> <ul> <li> <h3>北京大学</h3> <p>计算机科学与技术学士 - 2015年9月 至 2019年6月</p> </li> </ul> </section> <section class="work-experience"> <h2>工作经历</h2> <ul> <li> <h3>阿里巴巴集团</h3> <p>前端开发工程师 - 2019年7月 至 现在</p> <ul> <li>负责多个项目的前端开发工作</li> <li>优化页面性能,提升用户体验</li> <li>参与团队的技术分享和培训</li> </ul> </li> </ul> </section> <section class="skills"> <h2>技能</h2> <ul> <li>HTML/CSS</li> <li>JavaScript</li> <li>React</li> <li>Vue.js</li> <li>Node.js</li> <li>Git</li> </ul> </section> <section class="projects"> <h2>项目经验</h2> <ul> <li> <h3>在线教育平台</h3> <p>负责前端架构设计和核心模块开发</p> <p>技术栈: React, Redux, Node.js</p> </li> <li> <h3>企业级管理系统</h3> <p>参与需求分析、系统设计和编码实现</p> <p>技术栈: Vue.js, Vuex, Express</p> </li> </ul> </section> </div> </body> </html> ``` CSS (styles.css) ```css body { font-family: Arial, sans-serif; line-height: 1.6; margin: 0; padding: 0; background-color: #f4f4f4; } .resume-container { max-width: 800px; margin: 20px auto; padding: 20px; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } header { text-align: center; margin-bottom: 20px; } header h1 { margin: 0; font-size: 2.5em; } header p { margin: 0; font-size: 1.2em; color: #555; } section { margin-bottom: 20px; } section h2 { font-size: 1.8em; margin-bottom: 10px; border-bottom: 2px solid #333; padding-bottom: 5px; } section ul { list-style: none; padding: 0; } section li { margin-bottom: 10px; } section li h3 { font-size: 1.4em; margin: 0 0 5px 0; } section li p { margin: 0; color: #555; } section li ul { margin-left: 20px; list-style: disc; } .contact-info ul { display: flex; justify-content: space-around; align-items: center; } .contact-info li { margin: 0; } ``` 这个示例包含了一个简单的个人简历页面,包括基本信息、联系方式、教育、工作经历、技能和项目经验。你可以根据自己的实际情况进行修改和扩展。希望这对你有帮助! [2024-11-11 10:08:27 | AI写代码神器 | 1077点数解答]