CSS를 사용하여 문자열 입력 후 줄 바꿈을 추가하는 방법

Question

내 웹 사이트에 Ecwid 가게를 설치 중입니다.

우리가 "SKU"문자열의 이름을 선언해야하는 "SKU"문자열 입력 필드가 있습니다. 입력 필드에 문자열을 입력하기 만하면됩니다. 그러나

노란색과 파란색, 빨간색과 검은 색

: 대신 SKU 1 개 단어를 사용

, 내 SKU 문자열은 다음과 같이 될 것이다 그래서,이 개 문구가되고 싶어요 , SKU가 줄 바꿈으로 웹 사이트에 표시되기를 바랍니다. 그래서 웹 사이트에 다음과 같이 될 것이다 :

이

노란색과 파란색,

이

빨간색과

검은 우리가 할 수있는 입력 필드에 입력하지 코드, 그냥 일반 텍스트처럼 보이는 것 같다 . 어쩌면 브레이크 라인의 코드를 수정하려고하지 않고 있지만, 이것을 달성하기 위해 다른 것을해야 할 것 같습니다.

그러나 SKU에 대한 맞춤 CSS를 만들 수 있습니다. 그러나 CSS를 사용하여 SKU 문자열에 줄 바꿈 줄을 추가하는 방법을 모르겠습니다. SKU에 대한

기본 코드는 다음과 같습니다

/* 제품 SKU */

div.ecwid-productBrowser-SKU {

폰트 : 일반 13px의 굴림, 제네바, verdana, sans-serif;

색상 : # 1e2c38;

word-wrap : break-word;

}

span.ecwid-productBrowser-SKU 값 {

디스플레이 인라인 블록;

} CSS 코드를 사용자 정의하거나 어쩌면 그래서 문자열이 브레이크 라인을 가지고 문자열 필드에 코드를 inputing의

어떤 아이디어?

제발 도와주세요, 나는 Ecwid 팀에 연락했지만 너무 오래 걸립니다.

고맙습니다.

Answer 1

나는 이것이 css로는 불가능하다고 생각하지 않습니다. 요소 중 하나 주위에 일종의 태그를 감쌀 수 없다면 말입니다. 모든 태그는 (<b>, <i> 등등) 할 수 있습니다.

당신이 jQuery로 같은 일을 달성하려면

여기 당신이 그것을 할 수있는 방법은 다음과 같습니다 도움이

http://jsfiddle.net/Sg5BB/35/

var test = $('.test').text(); 
var result = test.replace(/,/g,',<br/>'); 

$('.test').html(result); 

희망.