xml css制作简历

XML结合CSS制作简历的方法

使用XML定义简历结构，CSS控制样式，实现内容与表现分离。

简历XML结构示例

<?xml version="1.0" encoding="UTF-8"?>
<resume>
  <header>
    <name>张三</name>
    <contact>
      <phone>13800138000</phone>
      <email>example@email.com</email>
    </contact>
  </header>
  <education>
    <degree>计算机科学硕士</degree>
    <university>XX大学</university>
    <year>2015-2018</year>
  </education>
  <experience>
    <job>
      <title>前端开发工程师</title>
      <company>ABC公司</company>
      <period>2018-至今</period>
    </job>
  </experience>
</resume>

配套CSS样式示例

resume {
  font-family: Arial, sans-serif;
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}

name {
  display: block;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 10px;
}

contact {
  display: block;
  color: #666;
  margin-bottom: 20px;
}

education, experience {
  display: block;
  margin-bottom: 30px;
}

degree, title {
  font-weight: bold;
  display: block;
}

university, company {
  display: block;
  margin: 5px 0;
}

year, period {
  color: #666;
  font-style: italic;
}

浏览器显示技巧

XML文件需添加样式表引用才能在浏览器中正确显示：

<?xml-stylesheet type="text/css" href="resume.css"?>

打印优化技巧

添加打印专用样式：

@media print {
  resume {
    padding: 0;
    width: 100%;
  }
  contact {
    color: #000;
  }
}

注意事项

• XML标签命名需语义化，避免使用空格和特殊字符
• CSS选择器需严格匹配XML元素名称
• 现代浏览器可能要求XML和CSS文件同域
• 考虑添加XSLT转换实现更复杂的格式控制