Formating Preformated Text on Your Website 귀하의 웹사이트에 preformated 텍스트를 조판

On occasion, I have used the html <pre> tab to preformat an error message or other standout text in a post. 이 자리에서 나는 <pre> 탭을 사용하여 html preformat에 오류 메시지가 나타나거나 게시물을 다른 설경구의 텍스트를합니다. At least one Sciencetext reader was intrigued as to how I managed to wrap the text rather than it being displayed right across the post area or with a horizontal scrollbar. 적어도 하나의 sciencetext 리더는 호기심을 관리하는 방법을 포장하는데 나는 그것이 표시 오른쪽의 텍스트가 아닌 전체 포스트 영역이나 수평으로 스크롤 막대합니다.

Well, there is a very simple CSS hack. 그렇다면, 거기는 아주 간단한 전투 근무 지원 해킹합니다. Open up your stylesheet (be sure to make a backup first) and add this code to the bottom. 당신의 스타일 시트를 열어 (반드시 백업 첫 번째)과 바닥에이 코드를 추가합니다.

/* Browser specific (not valid) styles to make preformatted text wrap */ / * 브라우저를 구체적인 정보 (유효하지 않습니다) 스타일로 설정된 텍스트를 만들어 포장 * /

pre { 사전 (
white-space: pre-wrap; /* css-3 */ 흰색 - 공간 : 사전 - 랩; / * 전투 근무 지원 - 3 * /
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 흰색 - 우주 : - moz - 이전 - 랩; / * 모질라, 1999 년 이후 * /
white-space: -pre-wrap; /* Opera 4-6 */ 흰색 - 우주 : - 이전 - 랩; / * 오페라 4-6 * /
white-space: -o-pre-wrap; /* Opera 7 */ 흰색 - 우주 : - 오 - 이전 - 랩; / * 오페라 7 * /
word-wrap: break-word; /* Internet Explorer 5.5+ */ 워드 - 포장 : 휴식 시간 - 단어; / * 인터넷 탐색기 5.5 + * /
} )

Save the sheet and refresh the page on which you are using the preformated chunk of text, it should now be wrapping better than Ice T. There are various other ways to implement this 저장하고 페이지를 새로 고치십시오 시트 및 preformated 덩어리를 사용하고있는 텍스트, 그것은 이제는 얼음보다 더 포장을 구현하는 다른 방법이 다양하다 t. hack 해킹 , but this is the quickest and easiest. , 그러나이 빠르고 쉽게합니다. You can also add other CSS tags to change the font size, for instance, so that the preformated block of text doesn’t look so clunky. 기타 전투 근무 지원에 태그를 추가할 수도있습니다 글꼴 크기를 변경하려면, 예를 들어, 그럼이 텍스트 블록을 preformated 너무 어설픈가되지 않습니다. The Sciencetext stylesheet for instance includes font-size:0.9em; to reduce the font size to 90%, which makes it look a little more stylish. 글꼴 - the sciencetext 스타일 시트를 예를 들면 포함 크기 : 0.9em;을 줄이기 위해 글꼴 크기를 90 %, 그 덕에 조금 더 세련된 보이게합니다. You could add borders, change the font, in fact apply all kinds of special formating. 수 장바구니 테두리, 글꼴을 변경합니다, 사실 모든 종류의 특수 조판 적용됩니다. Just remember it will apply site wide to all pre text if you add the code to the stylesheet. 단지 기억하고있어 이전의 모든 텍스트를 사이트 전체에 적용됩니다 코드를 추가하는 경우 스타일 시트를합니다.