用html编写页面有一个圆角边框板块居中、颜色为粉色，宽为60%、高为80%，板块中左上为医生相片，右侧为信息包括姓名、性别、学历、科室

可以使用以下HTML和CSS代码实现：

<div class="doctor-info">
  <img src="doctor_photo.jpg" alt="Doctor Photo" class="photo">
  <div class="info">
    <p>Name: <span class="name">John Doe</span></p>
    <p>Gender: <span class="gender">Male</span></p>
    <p>Education: <span class="education">MD, PhD</span></p>
    <p>Department: <span class="department">Cardiology</span></p>
  </div>
</div>

.doctor-info {
  width: 60%;
  height: 80%;
  margin: auto;
  background-color: pink;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.photo {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  margin-right: 50px;
}

.info {
  font-size: 20px;
}

.name {
  font-weight: bold;
}

.gender,
.education,
.department {
  font-style: italic;
}

解释一下CSS代码：

- `.doctor-info` 表示整个圆角边框板块，使用 `width: 60%; height: 80%;` 设置宽高为60%和80%，使用 `margin: auto;` 居中，使用 `background-color: pink;` 设置背景颜色为粉色，使用 `border-radius: 20px;` 设置边框为圆角，使用 `display: flex; justify-content: center; align-items: center;` 让内容在水平和垂直方向都居中。
- `.photo` 表示医生相片，使用 `width: 150px; height: 150px;` 设置宽高为150px，使用 `border-radius: 50%;` 让图片变成圆形，使用 `margin-right: 50px;` 把图片和信息之间的距离调大。
- `.info` 表示信息部分，使用 `font-size: 20px;` 设置字体大小为20px。
- `.name` 表示姓名，使用 `font-weight: bold;` 让字体加粗。
- `.gender, .education, .department` 表示性别、学历、科室，使用 `font-style: italic;` 让字体变成斜体。