【发布时间】:2020-11-26 16:08:48
【问题描述】:
我有一个问题,这是我的错,但我正在努力解决这个问题......
我正在为电子商务建立一个网站,当您进入产品页面时,在底部,我有所有产品的描述/规格,并且它们都不同(我有超过 3000 种产品),一些产品没有 2 列,其他列...顺便说一句,跳到问题
- 我创建了一个表,但是我放错了
- td style="width:50%">
- 我完成了 PC 和平板版本,一切都很好...但是对于移动设备,我使用显示块,因为我只想要 1 列...但我想要宽度:100%...
- 我试过
#vpc1 td{ width:100% !important; min-width:100% !important;},还有代码#vpc td[style]... - 我用边框和背景进行了测试,工作正常,但宽度没有改变...
<table id="tablevpc1">
<tbody>
<tr>
<td style="width: 50%;">
<ul id="ulvpc">
<li><strong style="font-size: 20px;">Inovadores Sensores VPC Ativos DataCAN</strong></li>
<li>VPC TM comunicação pelos cabos de tensão do veículo, tecnologicamente revolucionarios, eliminando a necessidade de passar cabos até à unidade de controle do sistema. Utiliza os cabos existentes no veículo, para enviar sinais digitais dos novos sensores digitais activos através da patenteada tecnologia DataCAN TM ao mostrador de LED no interior do habitáculo. Esta versatilidade oferece a melhor e única solução para aplicação em veículos de passageiros, camiões com e sem atrelado, autocarros, camionetas, autocaravanas, veículos com rulote, equipamentos agrícolas.</li>
</ul>
</td>
<td style="width: 50%;">
<ul id="ulvpc2">
<li><strong>3E-VPC3048DL</strong> Kit dianteiro 4 sensores VPC em forma de L com mostrador</li>
<li><strong>3E-VPC3048BL</strong> Kit dianteiro 4 sensores VPC em forma de L com buzzer</li>
<li><strong>3E-VPC3047BS</strong> Kit traseiro 4 sensores VPC direitos com bessouro</li>
<li><strong>3E-VPC3047BL</strong> Kit traseiro 4 sensores VPC em L com bessouro</li>
<li><strong>3E-VPC3047DS</strong> Kit traseiro 4 sensores VPC direitos com mostrador</li>
<li><strong>3E-VPC3047DL</strong> Kit traseiro 4 sensores VPC em L com mostrador</li>
<li><strong>3E-VPC304P2L</strong> Kit traseiro 4 sensores VPC em L aplicado como segundo<br /> sistema num veículo como a vref. VPC3047 ex. uso na rulote</li>
</ul>
</td>
</tr>
</tbody>
</table>
<!-- **THE STYLE I'M TRYING TO USE:** -->
@media (max-width: 768px) {
#tablevpc1 {
border: 0;
min-width:99% !important!;
}
#tablevpc1 tr {
margin-bottom: 10px;
min-width:99% !important!;
display: block;
}
#tablevpc1 td{
min-width:99% !important!;
display: block;
text-align: left;
font-size: 13px;}
#tablevpc2 {
border: 0;
min-width:99% !important!;
}
#tablevpc2 tr{
min-width:99% !important!;
margin-bottom: 10px;
display: block;
}
#tablevpc2 td{
min-width:99% !important!;
display: block;
text-align: left;
font-size: 13px;}
}
【问题讨论】:
-
如果某个答案解决了您的问题,请考虑接受该答案。以下是meta.stackexchange.com/questions/5234/… 然后返回此处并对勾号/复选标记执行相同操作直到它变为绿色的方法。这通知社区,找到了解决方案。否则,其他人可能会认为问题仍然悬而未决,可能想要发布(更多)答案。您将获得积分,并鼓励其他人帮助您。 欢迎来到 Stack!
标签: html css html-table width inline-styles