Помогите пожалуйста с версткой ? Есть решение
Добрый день! Есть таблица с ценами от количества (плагин комплексные цены) https://kupitkorobki.ru/gofrok..., можно ли сделать ее в виде списка? Пример на скрине.
<table style="width:100%">
<tbody>
<tr>
{foreach $prices as $price}
<td class="complex-plugin-price" id="complex-plugin-{$price.id}" data-id="{$price.id}">
<strong><center>{$price.name}</center></strong>
</td>
{/foreach}
</tr>
<tr>
{foreach $prices as $price}
<td class="value complex-price-wrapper" data-id="{$price.id}">
<span class="price complex-price-value">{$price.value_format_html}</span>
</td>
{/foreach}
</tr>
</tbody>
</table>
<br>
сейчас вот такие стили:
.complex-plugin-table table td {
border: 1px solid #bbb;
padding: 15px;
}
.complex-plugin-table table tr {
transition: 0.3s;
}
.complex-plugin-table table tr:hover {
box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
.complex-plugin-table table td.value {
text-align: center;
width: 100px;
}
6 ответов
Не факт что на скрине мы видим список, но не стану утверждать и обратное, поскольку концептуально есть как минимум три возможных варианта сделать полностью идентичный вывод, применяя принципиально разную верстку.
Зачем перебирать один и тот же массив два раза, чтобы сформировать простую табличку, у которой ещё и большие проблемы с тем, чтобы уместиться в ширину узкого правого блока из-за особенностей построения при большом кол-ве $price.name?
Можно к списку не прибегать даже, а сделать вот такой вполне аккуратный вывод.
<table> {foreach $prices as $price} <tr> <td class="1"> {$price.name} </td> <td class="2"> {$price.value_format_html} </td> </tr> {/foreach} </table>Стилями 1 и 2 уже оформить по вкусу. Да, это будет таблица, но уже совсем другая, намного проще и удобнее.
P.S. Если данные упакованы в таблицу, а <td> имеют классы и все данные в ячейке отформатированы полностью одинаково, то применять всякие <center>, <strong>, <span> внутри ячейки не нужно от слова совсем. Не стоит создавать лишний мусор.
спасибо большое!
Уже лучше, но, если заполнитель в виде точек перестанет являться частью имени комплексной цены, а будет реализован, например, через псевдоэлемент ::before как в таблице хар-к ниже на странице товара, то совсем замечательно.
не подскажете, как это сделать?)
Как будет время, то набросаю пример по вашему сайту.
буду очень признательна)