텍스트 범위의 채색 된 배경 채우기?

Question

필자는 긴 상자 (인라인 요소)의 검정색 배경에 여러 줄을 긋을 수있는 흰색 텍스트가 있습니다. 전체 상자의 배경이 아니라 텍스트 자체의 배경입니다. 나는이 텍스트를 <span> 요소에 색 및 backround-color의 사양으로 넣음으로써이 작업을 수행합니다.

텍스트의 검정색 배경 가장자리와 글자 사이에 약간의 수평 간격을두고 싶습니다. 스패닝에 패딩을 추가하면 왼쪽 및 오른쪽 패딩은 전체 스팬의 첫 번째 및 마지막 문자 전후에 표시되지만 각 행의 시작 부분에는 나타나지 않으며 각 행을 시작 및 끝내기 위해 일부 공간이 필요합니다. 검정색 배경의 가장자리까지.

텍스트가 연속적으로 변경되고 글자가 고정 공간이 아니므로 인위적으로 & nbsp를 추가 할 수 없습니다. 요소를 각 행의 시작과 끝으로 가져옵니다. 이것이 내가 지금까지 그 공간을 만들 수있는 유일한 방법입니다.

각 줄의 시작과 끝 부분에 텍스트를 인라인으로 흐르는 공간을 만드는 것은 정말로 불가능합니까?

Answer 1

span 태그에 없으면 p 태그를 사용하거나 div에 넣으십시오. "블록 디스플레이", C. Malet 말했듯

가스켓 및 마진 는 div 또는 p 또는 CSS 속성을 사용하는 경우 .. 그 인라인 사촌 span와 스팬

Answer 2

그것 불가능을 적용 할 수 없다 배경은 전체적으로 적용되지만 각 줄마다 적용되지는 않습니다.

Answer 3

답변 해 주셔서 감사합니다. 나는 오른쪽과 왼쪽으로의 오프셋을 가진 두 개의 추가 스팬 안에 스팬을 중첩하여이 작업을 수행하는 방법을 찾았습니다.

.theSpan { position: relative; right: 5px; background-color: #000000; color: #ffffff; } 
.outer1 { position: relative; background-color: #000000; } 
.outer2 { position: relative; left: 10px; background-color: #000000; }