#javascript #jquery #css
#javascript #jquery #css
Вопрос:
Есть ли способ преобразовать существующую таблицу из 6 строк в 2 строки и 3 столбца, используя существующий класс. У меня нет доступа к файлам html. Можно добавить таблицу стилей только к существующим классам
<table cellspacing="0">
<tbody><tr>
<td class="class1"><label for="radio0">
<input type="radio" checked="" value="1" name="name" id="radio0">1
</label></td>
</tr>
<tr>
<td class="class2"><label for="radio1">
<input type="radio" value="8" name="name" id="radio1">2
</label></td>
</tr>
<tr>
<td class="class3"><label for="radio2">
<input type="radio" value="12" name="name" id="radio2">3
</label></td>
</tr>
<tr>
<td class="class4"><label for="radio3">
<input type="radio" value="4" name="name" id="radio3">4
</label></td>
</tr>
<tr>
<td class="class5"><label for="radio4">
<input type="radio" value="7" name="name" id="radio4">5
</label></td>
</tr>
<tr>
<td class="class6"><label for="radio5">
<input type="radio" value="5" name="name" id="radio5">6
</label></td>
</tr>
</tbody></table>
Комментарии:
1. Я думаю, вам нужно использовать JS для решения этой проблемы.
Ответ №1:
Вы всегда можете позиционировать элементы как абсолютные, но я хочу предупредить вас, что это может не совпадать.. И это также изменяет только CSS. Пример здесь
CSS:
.class3{
position:absolute;
margin-left: 40px;
top: 9px;
}
.class4{
position:absolute;
margin-left: 40px;
top: 30px;
}
.class5{
position:absolute;
margin-left: 80px;
top: 9px;
}
.class6{
position:absolute;
margin-left: 80px;
top: 30px;
}
Комментарии:
1. Я также рад, что это сработало 🙂 Возможно, вы обнаружите, что решение на JS будет работать лучше в будущем, если у вас есть к нему доступ!