Javascript와 CSS를 사용하여 데이터베이스에 텍스트를 동적으로 가져 오는 경우 텍스트를 열로 나누는 방법?

Question

스크립트가 각 컨테이너에서 일정 수의 문자를 만들 수 있다고 생각합니다. 그런 대본을 아십니까? 여러개의 CSS 파일을 사용할 수있는 반응 형 디자인이지만 단 하나의 html 파일 만 필요합니다.

이 문제는 동적으로 얻을 수있는 텍스트에 포함되어있어서 얼마나 많은 문자를 얻을 수 있는지 알지 못합니다. 데스크톱 크기에서는 단락이 다른 단락보다 위에 배치됩니다. Ipad 크기에서 단락은 오른쪽과 왼쪽의 두 열로 정렬됩니다.

Answer 1

som jquery 플러그인이 있습니다. 예 : Columnizer

Answer 2

이렇게 생각하세요?

var yourText = $('selector'); 
$(yourText).each(function() { 
    if ($(this).text().length >= 200) { 
     $(this).text($(this).text().substring(0, 200)0); 
    } 
}); 

그것은 당신이, 400 불행하게도이 단어를 분할하고 일부 문자는 다른 사람보다 더 넓은 것을 인식하지 못하는 0200 (200)에 변수를 전환해야 다음 200 .. 처음 200 개 문자를받을 wiil ..

Answer 3

IE8 이하에서는 지원되지 않지만 CSS3의 columns을 사용하여 CSS만으로이 작업을 수행 할 수 있습니다. 다른 포스터에 의해 제안 당신이 jQuery Masonry 또는 Columnizer 같은 조건의 의견과 뭔가를 사용할 수 있습니다 IE에 대한 대체로서

div { 
    -moz-column-count: 3; 
    -moz-column-gap: 10px; 
    -webkit-column-count: 3; 
    -webkit-column-gap: 10px; 
    column-count: 3; 
    column-gap: 10px; 
    width: 560px; 
} 

.

Demo IE에서 정상적으로 저하됩니다.