gpt4 book ai didi

html - 调整大小时页面中的表格宽度问题

转载 作者:行者123 更新时间:2023-11-28 10:36:34 25 4
gpt4 key购买 nike

正如您从屏幕截图中看到的那样,当页面调整大小时(顺便说一句,这是一个响应式网页),其中的表格会溢出!尝试查看是否还有其他地方提到了 width 属性。并且还尝试查找是否缺少任何其他标签。但一切似乎都很好,我已经摆弄这个简单的布局问题 2 个多小时了!

这是实时站点:<REMOVED URL>

该表位于“功能”部分下。

有什么关于导致问题的建议吗?到目前为止,我一直在通过 Google Chrome 的开发者工具摆弄 css。

enter image description here

编辑

HTML代码:

<div class="colorblock block priceblock">
<div id="price" class="block-container">
<div class="hexagon hexagon-top">
<div class="outer"></div>
<div class="inner"><img class="hexagonAndroidImg" src="http://online2shop.net/xbmcbox/wp-content/uploads/2014/04/andriod_logo.png"></div>
</div>

<h2 class="title">Features</h2>
<div class="description"></div>




<div class="infoblock">



<!--- Added by ABC on 26Apr2014 -->

Specifications <br>

<strong>M8 Android 4.3/Android 4.4 KitKat TV Box Specifications:</strong>
<table class="tblFeatures" style="
width: 100%;
">
<tbody>
<tr>
<td colspan="2"><strong>Hardware&nbsp;Specifications</strong></td>
</tr>
<tr>
<td>CPU</td>
<td>Amlogic&nbsp;S802&nbsp;Quad&nbsp;core&nbsp;Cortex&nbsp;A9r4&nbsp;2GHz</td>
</tr>
<tr>
<td>GPU</td>
<td>Octa-core&nbsp;Mali-450MP&nbsp;GPU&nbsp;@&nbsp;600MHz</td>
</tr>
<tr>
<td>FLASH</td>
<td>8&nbsp;GB&nbsp;NAND&nbsp;FLASH</td>
</tr>
<tr>
<td>SDRAM</td>
<td>2GB&nbsp;DDR3</td>
</tr>
<tr>
<td colspan="2"><strong>Power&nbsp;Supply&nbsp;Specifications</strong></td>
</tr>
<tr>
<td>Power&nbsp;Supply</td>
<td>DC5V/2A</td>
</tr>
<tr>
<td>Power&nbsp;Indicator&nbsp;(LED)</td>
<td>Power&nbsp;ON&nbsp;:blue;&nbsp;Standby&nbsp;:Red</td>
</tr>
<tr>
<td colspan="2"><strong>Main&nbsp;Features</strong></td>
</tr>
<tr>
<td>OS</td>
<td>Android&nbsp;4.4&nbsp;KitKat&nbsp;OS</td>
</tr>
<tr>
<td>3D</td>
<td>Hardward&nbsp;3D&nbsp;graphics&nbsp;acceleration</td>
</tr>
<tr>
<td>Support&nbsp;Decoder&nbsp;format</td>
<td>HD&nbsp;MPEG1/2/4,H.264,&nbsp;HD&nbsp;AVC/VC-1,RM/RMVB,Xvid/DivX3/4/5/6&nbsp;,RealVideo8/9/10</td>
</tr>
<tr>
<td>Support&nbsp;Media&nbsp;format</td>
<td>Avi/Rm/Rmvb/Ts/Vob/Mkv/Mov/ISO/wmv/asf/flv/dat/mpg/mpeg</td>
</tr>
<tr>
<td>Support&nbsp;Music&nbsp;format</td>
<td>MP3/WMA/AAC/WAV/OGG/AC3/DDP/TrueHD/DTS/DTS/HD/FLAC/APE</td>
</tr>
<tr>
<td>Support&nbsp;Photo&nbsp;format</td>
<td>HD&nbsp;JPEG/BMP/GIF/PNG/TIFF</td>
</tr>
<tr>
<td>USB&nbsp;host</td>
<td>2High&nbsp;speed&nbsp;USB&nbsp;2.0,support&nbsp;USB&nbsp;DISK&nbsp;and&nbsp;USB&nbsp;HDD</td>
</tr>
<tr>
<td>Card&nbsp;reader</td>
<td>SD/SDHC/MMC&nbsp;cards</td>
</tr>
<tr>
<td>HDD&nbsp;file&nbsp;system</td>
<td>FAT16/FAT32/NTFS</td>
</tr>
<tr>
<td>Support&nbsp;Subtitle</td>
<td>SRT/SMI/SUB/SSA/IDX+USB</td>
</tr>
<tr>
<td>High&nbsp;Difinition&nbsp;video&nbsp;output</td>
<td>SD/HD&nbsp;max.1920x1080&nbsp;pixel</td>
</tr>
<tr>
<td>OSD&nbsp;type&nbsp;of&nbsp;languages</td>
<td>English/French/German/Spanish/Italian/&nbsp;etc&nbsp;multilateral&nbsp;languages</td>
</tr>
<tr>
<td>LAN</td>
<td>Ethernet:10/100M,&nbsp;standard&nbsp;RJ-45</td>
</tr>
<tr>
<td>Wireless</td>
<td>Built&nbsp;in&nbsp;WiFi</td>
</tr>
<tr>
<td>Mouse/&nbsp;Keyboard</td>
<td>
Support&nbsp;mouse&nbsp;and&nbsp;keyboard&nbsp;via&nbsp;USB;
Support&nbsp;2.4GHz/5GHZ wireless&nbsp;mouse&nbsp;and&nbsp;keyboard&nbsp;via&nbsp;2.4GHz&nbsp;USB&nbsp;dongle
</td>
</tr>
<tr>
<td>HDMI</td>
<td>HDMI&nbsp;1.4&nbsp;up&nbsp;to&nbsp;4K2K</td>
</tr>
<tr>
<td>AV</td>
<td>AV</td>
</tr>
<tr>
<td>3G</td>
<td>Support</td>
</tr>
<tr>
<td>DOLBY&nbsp;TrueHD&nbsp;and&nbsp;DTS&nbsp;HD</td>
<td>DOLBY&nbsp;TrueHD&nbsp;and&nbsp;DTS&nbsp;HD&nbsp;Bypass&nbsp;through&nbsp;HDMI</td>
</tr>
<tr>
<td colspan="2"><strong>Software&nbsp;Specifications</strong></td>
</tr>
<tr>
<td>Network&nbsp;Function</td>
<td>Skype&nbsp;chatting,Picasa,Youtube,Flicker,Facebook,Online&nbsp;movies,etc</td>
</tr>
<tr>
<td>Other&nbsp;feature</td>
<td>Free&nbsp;Internet&nbsp;searching,thousands&nbsp;of&nbsp;android&nbsp;applications,many&nbsp;kinds&nbsp;of&nbsp;games,etc.</td>
</tr>
</tbody>
</table>
<br style="color: #222222;">
<strong style="color: #222222;">M8 Android 4.3/Android 4.4 KitKat TV Box Package Contains:</strong><br style="color: #222222;"><br style="color: #222222;">
<ul style="color: #222222;">
<li>HDMI Cable*1</li>
<li>USB Cable*1</li>
<li>Manual*1</li>
<li>AV Cable*1</li>
<li>Adapter*1</li>
</ul>




</div>
</div>
</div>

CSS:

.tblFeatures td{ border-color: #1DB6B6; padding-top: 5px; padding-bottom: 5px;}
.priceblock .block-container .infoblock {
float: none;
width: 100%;
margin-left: 0px;
}

.priceblock .block-container .infoblock {
float: none;
width: 100%;
margin-left: 0px;
}

.block {
float: left;
width: 100%;
position: relative;
padding: 0 0 100px 0;
}

最佳答案

<td>Amlogic&nbsp;S802&nbsp;Quad&nbsp;core&nbsp;Cortex&nbsp;A9r

  被称为不间断 空间是有原因的。它可以防止线断裂。如果您希望文本适应表格的宽度,则必须去掉它们。

关于html - 调整大小时页面中的表格宽度问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23310222/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com