首页 > 解决方案 > 显示内容是使用css的样式框

问题描述

我有如下内容:

Scan Summary:

Total Found: 363
Total Dir: 153
Planned Sync Files: 210
Actual Synced: 210
Missing Synced Files: 0

我的 div:

<div class="page_summary">
  <div><h3 style="display: inline-block;width: 50%;" class="total_found">Total Found: '.$totalFind.'</h3></div>
  <div><h3 style="display: inline-block;width: 50%;">Total Dir: '.$totalIsDir.'</h3><br/></div>
  <div><h3 style="display: inline-block;width: 33%;">Planned Sync Files: '.$totalShouldFind.'</h3></div>
  <div><h3 style="display: inline-block;width: 33%;">Actual Synced: '.$totalResolved.'</h3><br/></div>
  <div><h3 style="display: inline-block;width: 33%;">Missing Synced Files: '.$forOfor.'</h3><br/></div>
</div>

我想分别在样式框中分别显示 Total Found、Total Dir、Total Sync Files、Actual Synced Files 和 Missing Synced Files,我搜索了很多但确实找到了正确的匹配项。

我想像仪表板一样显示每个项目。

标签: cssanimationbackground-color

解决方案


希望这对您有所帮助。

        <div class="page_summary">
        <div style="display: inline-block;width: 50%;float:left;"><h3 class="total_found">Total Found: '.$totalFind.'</h3></div>
        <div style="display: inline-block;width: 50%;float:left;"><h3 style="display: inline-block;width: 50%;">Total Dir: '.$totalIsDir.'</h3><br/></div>
        <div style="display: inline-block;width: 33.33%;float:left;"><h3 style="display: inline-block;width: 33%;">Planned Sync Files: '.$totalShouldFind.'</h3></div>
        <div style="display: inline-block;width: 33.33%;float:left;"><h3 style="display: inline-block;width: 33%;">Actual Synced: '.$totalResolved.'</h3><br/></div>
        <div style="display: inline-block;width: 33.33%;float:left;"><h3>Missing Synced Files: '.$forOfor.'</h3><br/></div>
        </div>

推荐阅读