新增结构单元拆解板块（屋面4图+柱身图文2:1），重构性能分析3板块（受力分析/节能计算/光环境）
This commit is contained in:
133
performance.html
133
performance.html
@@ -61,20 +61,141 @@
|
||||
</section>
|
||||
|
||||
<!-- 内容区域 -->
|
||||
<section class="section">
|
||||
|
||||
<!-- 1. 结构受力分析 -->
|
||||
<section class="section" id="structural-analysis">
|
||||
<div class="container">
|
||||
<h2 class="section-title">结构受力分析</h2>
|
||||
|
||||
<!-- 第一段文字 -->
|
||||
<div class="content-block">
|
||||
<p class="large-text">在此处插入结构受力分析的详细说明和图表...</p>
|
||||
<p class="large-text">在此处插入结构受力分析的第一段详细说明...</p>
|
||||
</div>
|
||||
|
||||
<!-- 受力分析图示（大图横向占满） -->
|
||||
<div class="full-width-image">
|
||||
<img src="images/perf-structure-full.jpg" alt="受力分析图示" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
||||
<div class="placeholder-text large" style="display:none;">受力分析图示</div>
|
||||
</div>
|
||||
|
||||
<!-- 第二段文字 -->
|
||||
<div class="content-block">
|
||||
<p class="large-text">在此处插入结构受力分析的第二段详细说明...</p>
|
||||
</div>
|
||||
|
||||
<!-- 左侧2张图 + 右侧3列4行表格 -->
|
||||
<div class="text-image-table-layout">
|
||||
<div class="layout-images-left">
|
||||
<div class="image-pair">
|
||||
<img src="images/perf-structure-01.jpg" alt="受力分析图1" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
||||
<div class="placeholder-text small" style="display:none;">受力分析图1</div>
|
||||
</div>
|
||||
<div class="image-pair">
|
||||
<img src="images/perf-structure-02.jpg" alt="受力分析图2" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
||||
<div class="placeholder-text small" style="display:none;">受力分析图2</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-table-right">
|
||||
<table class="performance-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>参数1</th>
|
||||
<th>参数2</th>
|
||||
<th>参数3</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>数据1</td><td>数据2</td><td>数据3</td></tr>
|
||||
<tr><td>数据4</td><td>数据5</td><td>数据6</td></tr>
|
||||
<tr><td>数据7</td><td>数据8</td><td>数据9</td></tr>
|
||||
<tr><td>数据10</td><td>数据11</td><td>数据12</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section section-alt">
|
||||
<!-- 2. 外围护节能计算 -->
|
||||
<section class="section section-alt" id="energy-calculation">
|
||||
<div class="container">
|
||||
<h2 class="section-title">节能计算</h2>
|
||||
<div class="content-block">
|
||||
<p class="large-text">在此处插入节能计算的详细说明和图表...</p>
|
||||
<h2 class="section-title">外围护节能计算</h2>
|
||||
|
||||
<!-- 左侧表格 + 右侧文字 -->
|
||||
<div class="table-text-layout">
|
||||
<div class="layout-table-left">
|
||||
<table class="performance-table wide">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>项目</th>
|
||||
<th>指标1</th>
|
||||
<th>指标2</th>
|
||||
<th>指标3</th>
|
||||
<th>指标4</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>项目1</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目2</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目3</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目4</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目5</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目6</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目7</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目8</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目9</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
<tr><td>项目10</td><td>数据</td><td>数据</td><td>数据</td><td>数据</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="layout-text-right">
|
||||
<p class="large-text">在此处插入外围护节能计算的详细说明...</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 3. 建筑光环境分析：采光模拟 -->
|
||||
<section class="section" id="lighting-simulation">
|
||||
<div class="container">
|
||||
<h2 class="section-title">建筑光环境分析：采光模拟</h2>
|
||||
|
||||
<!-- 4张光照分析图横向排开 -->
|
||||
<div class="image-slider-container">
|
||||
<div class="image-slider light-analysis">
|
||||
<div class="slider-item with-caption">
|
||||
<img src="images/perf-light-01.jpg" alt="光照分析图1" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
||||
<div class="placeholder-text small" style="display:none;">光照分析图1</div>
|
||||
<p class="image-caption">图名标注1</p>
|
||||
</div>
|
||||
<div class="slider-item with-caption">
|
||||
<img src="images/perf-light-02.jpg" alt="光照分析图2" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
||||
<div class="placeholder-text small" style="display:none;">光照分析图2</div>
|
||||
<p class="image-caption">图名标注2</p>
|
||||
</div>
|
||||
<div class="slider-item with-caption">
|
||||
<img src="images/perf-light-03.jpg" alt="光照分析图3" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
||||
<div class="placeholder-text small" style="display:none;">光照分析图3</div>
|
||||
<p class="image-caption">图名标注3</p>
|
||||
</div>
|
||||
<div class="slider-item with-caption">
|
||||
<img src="images/perf-light-04.jpg" alt="光照分析图4" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
||||
<div class="placeholder-text small" style="display:none;">光照分析图4</div>
|
||||
<p class="image-caption">图名标注4</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-hint">← 左右滑动查看更多 →</div>
|
||||
</div>
|
||||
|
||||
<!-- 左侧大图 + 右侧文字 -->
|
||||
<div class="text-image-layout reverse">
|
||||
<div class="layout-text">
|
||||
<p class="large-text">在此处插入全年照度平均值的详细说明...</p>
|
||||
</div>
|
||||
<div class="layout-image-single">
|
||||
<img src="images/perf-light-annual.jpg" alt="全年照度平均值" onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
||||
<div class="placeholder-text large" style="display:none;">全年照度平均值</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user