Советы по реализации автоматического переноса строк при создании веб-страниц CSS
Автор：Eve Cole
Время обновления：2025-01-15 17:00:16
Советы по реализации автоматического переноса строк при создании веб-страниц CSS Пятница, 6 марта 2009 г. 10:47 Все знают, что непрерывный английский или цифры могут привести к расширению контейнера и не могут автоматически переноситься в соответствии с размером контейнера. Вот как их переносить. используя метод CSS!
Для div 1. (браузер IE) white-space:normal; word-break:break-all здесь соответствует стандарту. #wrap {пробел: нормальная ширина: 200 пикселей };
или
#wrap{word-break:break-all;width:200px;}eg.<div id="wrap">ddd11111111111111111111111111111111</div>Эффект: возможен перенос строк 2. (Браузер Firefox) white-space:normal; word -break:break-all;overflow:hidden; Точно так же в FF нет хорошего метода реализации. Вы можете только скрыть или добавить полосы прокрутки. #wrap {пробел: нормальная; ширина: 200 пикселей; переполнение: авто;}
или
#wrap{word-break:break-all;width:200px; overflow:auto; }eg.<div id="wrap">ddd111111111111111111111111111111111111</div> Эффект: Контейнер нормальный, а содержимое таблицы 1 скрыто. (браузер IE) использовать стиль table-layout: исправлено;
например.<стиль>
.tb{макет таблицы: исправлено}
</style><table class="tbl" width="80">
<тр>
<td>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>Эффект: можно переносить строки. 2. (браузер IE) Используйте стиль table-layout: fixed и nowrapeg.<style>
.tb {макет таблицы: исправлено}
</style><table class="tb" width="80">
<тр>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>Эффект: можно обернуть 3. (браузер IE) используйте стиль table-layout:fixed и nowrap<style> при использовании процентов для исправления размера td http://www.knowsky.com/
.tb{макет таблицы: исправлено}
</style><table class="tb" width=80>
<тр>
<td width=25% nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table> Эффект: оба td переносятся нормально. 3. (Браузер Firefox) При использовании процентов для фиксации размера td используйте стили table-layout: fixed и nowrap, а также используйте diveg.<style>.
.tb {макет таблицы: исправлено}
.td {переполнение: скрыто;}
</style><table class=tb width=80>
<тр>
<td width=25% class=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
<td class=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
</tr>
</table> Ширина ячейки здесь должна быть определена в процентах. Эффект: нормальное отображение, но без переноса строк (Примечание: не существует хорошего способа обернуть содержимое контейнера под FF. Вы можете использовать только переполнение, чтобы скрыть лишнее). содержание, чтобы избежать влияния на общий эффект)
