Прекратить перенос слов

Question

body { word-wrap: break-word;}

Я использовал этот код (выше), чтобы поместить текст из body в его контейнер. Однако, что мне не нравится в этом, это то, что это разбивает слова.

Есть ли другой способ, при котором он не разбивает слова и только разрыв строки после или перед словом?

РЕДАКТИРОВАТЬ: Это для использования в UIWebView.

Answer 1

Может быть немного поздно, но вы можете добавить эту CSS, чтобы остановить разрывы слов:

.element {
    -webkit-hyphens: none;
    -moz-hyphens:    none;
    -ms-hyphens:     none;
    hyphens:         none;
}

Answer 2

используйте white-space: wrap;.Если вы установили ширину для элемента, для которого вы устанавливаете это, он должен работать.

update - отображаемые данные в Firefox

Answer 3

Вы можете попробовать это ...

body{
white-space: pre; /* CSS2 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP printers */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
word-wrap: break-word; /* IE */
}

{word-wrap :;} является частной собственностью IE, а не частью css.Обработка Firefox является правильной.К сожалению, FF не поддерживает мягкий дефис /.так что это не вариант.Возможно, вы могли бы вставить волосок или тонкий пробел, / (отметьте меня на числовом объекте) и /, соответственно.

Создание {overflow: hidden;} отключит переполнение, и {overflow: auto;} вызовет переполнение для включения прокрутки.

Answer 4

Пожалуйста, используйте Nowrap, и значение Wrap для меня не подошло. Nowrap решил проблему.

Use white-space: nowrap;

Answer 5

В моей ситуации я пытаюсь обеспечить перенос слов при правильном разрыве слов в ячейках таблицы.

Я обнаружил, что мне нужен следующий CSS для этого.

table {
  table-layout:fixed;
}
td {
  white-space: wrap;
}

также проверьтечто ничто другое не меняет word-break на break-word вместо normal.

Answer 6

У меня была такая же проблема, я решил ее, используя следующую CSS:

.className {
  white-space:pre-wrap;
  word-break:break-word;
}

Answer 7

Я столкнулся с аналогичной проблемой в моей структуре сетки и использовал слово-разрыв: слово-разрыв;в моей сетке, и моя проблема была решена.