Как я могу обернуть или разбить длинный текст /слово в фиксированную ширину?

Я хочу создать диапазон с фиксированной шириной, чтобы при вводе в него любой вещи, такой как <span>lgasdfjksdajgdsglkgsadfasdfadfasdfadsfasdfasddkgjk</span>, длинной строки текст без пробелов, слово (а) разрывается или переносится на следующую строку.

Есть идеи?

74 голоса | спросил Mohammad kasiri 14 AM000000110000002231 2013, 11:07:22

7 ответов


0

Вы можете использовать свойство CSS word-wrap:break-word;, которое будет разрывать слова, если они слишком длинны для ширины вашего диапазона.

 span { 
    display:block;
    width:150px;
    word-wrap:break-word;
}
 <span>VeryLongLongLongLongLongLongLongLongLongLongLongLongExample</span>
ответил Maxime Lorant 14 AM000000110000002831 2013, 11:10:28
0

Как это

ДЕМО

  li span{
    display:block;
    width:50px;
    word-break:break-all;
}
ответил Falguni Panchal 14 AM000000110000002531 2013, 11:09:25
0

Попробуйте выполнить следующее:

span {
    display: block;
    word-wrap:break-word;
    width: 50px;
    white-space: normal
}
ответил Gerard de Visser 17 ThuEurope/Moscow2015-12-17T19:50:08+03:00Europe/Moscow12bEurope/MoscowThu, 17 Dec 2015 19:50:08 +0300 2015, 19:50:08
0

По умолчанию span является inline

Вы можете настроить span таким образом, добавив display: block; в ваш CSS.

span {
    display: block;
    width: 100px;
}
ответил 14 AM000000110000004931 2013, 11:10:49
0

Попробуйте это

span {
    display: block;
    width: 150px;
}
ответил Eswara Reddy 14 AM000000110000004431 2013, 11:16:44
0

Просто для расширения практического объема вопроса и в качестве приложения к данным ответам: Иногда может оказаться необходимым указать селекторы немного больше.

Определяя полный диапазон как display: inline-block , вам может быть трудно отображать изображения.

Поэтому я предпочитаю определять диапазон так:

span {
  display:block;
  width:150px;
  word-wrap:break-word;      
}
p span, a span,
h1 span, h2 span, h3 span, h4 span, h5 span {
  display:inline-block;
}
img{
  display:block;
}
ответил leopold 19 MarpmMon, 19 Mar 2018 15:13:14 +03002018-03-19T15:13:14+03:0003 2018, 15:13:14
0

Я добавил к своему коду. Ответ тот же, что и выше.

   Dim lblSite As Label
   lblSite.Text = "lgasdfjksdajgdsglkgsadfasdfadfasdfadsfasdfasddkgjk"
   lblSite.Attributes.Add("style", "display:inline-block;width:175px;word-wrap:break-word;white-space: normal")
ответил JoshYates1980 8 MarpmWed, 08 Mar 2017 18:51:53 +03002017-03-08T18:51:53+03:0006 2017, 18:51:53

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132