Formating Preformated Text on Your Website Preformated de formato de texto en su sitio web

On occasion, I have used the html <pre> tab to preformat an error message or other standout text in a post. En ocasiones, he utilizado el html <pre> preformat ficha a un mensaje de error o de otro tipo standout texto en un puesto. 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. Por lo menos un lector Sciencetext estaba intrigado sobre cómo pude terminar el texto en lugar de lo que se está mostrando en toda la zona posterior o con un scrollbar horizontal.

Well, there is a very simple CSS hack. Bueno, hay una muy simple hack CSS. Open up your stylesheet (be sure to make a backup first) and add this code to the bottom. Abra su hoja de estilos (asegúrese de hacer una copia de seguridad primero) y añadir este código en la parte inferior.

/* Browser specific (not valid) styles to make preformatted text wrap */ / * El archivo específico (no válido) para hacer los estilos de texto preformateado recapitulación * /

pre { pre (
white-space: pre-wrap; /* css-3 */ espacios en blanco: pre-wrap; / * css-3 * /
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ espacios en blanco:-MOZ-pre-wrap; / * Mozilla, desde 1999 * /
white-space: -pre-wrap; /* Opera 4-6 */ espacios en blanco:-pre-wrap; / * Opera * 4-6 /
white-space: -o-pre-wrap; /* Opera 7 */ espacios en blanco:-o-pre-wrap; / * Opera 7 * /
word-wrap: break-word; /* Internet Explorer 5.5+ */ palabra-wrap: break-word; / * Internet Explorer 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 Guardar la hoja y actualizar la página en la que usted está usando la preformated fragmento de texto, debería ser ahora mejor que envolver Ice T. Hay varias otras maneras de aplicar el presente hack , but this is the quickest and easiest. , Pero esta es la más rápida y cómoda. 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. También puede añadir otras etiquetas CSS para cambiar el tamaño de la fuente, por ejemplo, a fin de que la preformated bloque de texto no parece tan molesta. 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. El Sciencetext hoja de estilos, por ejemplo, incluye font-size: 0.9em; para reducir el tamaño de la fuente al 90%, lo que le hace ver un poco más elegante. You could add borders, change the font, in fact apply all kinds of special formating. Se podría añadir las fronteras, cambiar la fuente, de hecho se aplican todo tipo de formatear especial. Just remember it will apply site wide to all pre text if you add the code to the stylesheet. Recuerde, su decisión de aplicar sitio amplia a todos los pre texto si añade el código a la hoja de estilos.