css - 使用 css 加载标题后显示文本

Question

我有 name、designation 和 description 三个字段。 这里首先要显示名称，先显示名称，过一段时间后需要显示描述，目前是一次显示总数。

<div class="teamspage4">
    <img src="<?php echo base_url();?>admin/images/blogimages/<?php echo $r->image_path;?>" class="img-responsive teamimage"/>          
    <div class="teamspage5"><?php echo $r->name;?></div>
    <div class="teamspage6"><?php echo $r->designation;?></div>
    <div class="teamspage76"><?php echo $r->description;?></div>
</div>          

Answer 1

试试这个

.teamspage5{
  opacity:0;
  animation: op 1s ease forwards;
}
.teamspage6{
  opacity:0;
  animation: op 1s ease forwards;
}
.teamspage76{
  opacity:0;
  animation: op 1s ease 1s forwards;
}
@keyframes op{
  0%{
    opacity:0;
  }
  100%{
    opacity:1;
  }
}

<div class="teamspage5">Name</div>
<div class="teamspage6">Designation</div>
<div class="teamspage76">Description</div>