HTML의 정렬되지 않은 목록에 배치 된 단어

<ul class="notice-ul"> 
<li class="notice-word-wrap">Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered,Delivered</li> 
<li>Delivered</li> 
</ul>

위의 내용은 HTML의 정렬되지 않은 목록입니다. 위의 대한 CSS는 :HTML의 정렬되지 않은 목록에 배치 된 단어

.notice-ul{ 
    list-style: none; 
} 

.notice-ul > li:before { 
content:"\2713\0020"; 
} 

.notice-word-wrap{ 
    display: block; 
    width: auto; 
    height: auto; 
    word-break: break-all; 
    word-wrap: break-word; 
    white-space: normal 
}

내가 여기에 직면 문제는 단어가 제대로 파괴되지 않은 첫 번째 목록의 포장에 관한 것입니다. 위의 결과 첨부 : Result in UI

출처

2016-08-11 Sundaresan.C

단어에 공백을 추가하는 경우 몇 가지 문제가 발생합니까? –

그럼 잘 됐니? –

@ThomasByy. 그래도 여전히 잘못되었습니다. 예 : 첫 번째 줄에 D로 전달되고 두 번째 줄에 전달됨 –

쉼표 (및 단어 사이) 뒤에 공백을 추가하면 텍스트 흐름과 줄 바꿈이 일반적으로 html로 이루어져야합니다.

출처

2016-08-11 07:01:09

예, 여전히 잘못되었습니다. 예 : 첫 줄에 D로 전달되고 두 번째 줄에 배달 됨 –

공백을 추가하고 CSS에서이 줄을 제거하십시오. word-break : break-all; –

당신은 깨뜨릴 수없는 것으로 범위 태그와 스타일 범위 요소와 모든 "파괴해서는 안된다"부품을 포장 할 수 있습니다.

<li class="notice-word-wrap"><span>Delivered,</span><span>Delivered,</span><span>Delivered,</span><span>Delivered,</span><span>Delivered,</span><span>Delivered,</span><span>Delivered,</span><span>Delivered,</span>Delivered</li>

다음 CSS를 깨는에서 단어를 방지 할 수

span{ 
     word-break: normal; 
    word-wrap: normal; 
}

에서,하지만 일부 콘텐츠 장식이 필요합니다.

출처

2016-08-11 07:38:01

HTML의 정렬되지 않은 목록에 배치 된 단어

답변

관련 문제