Sobre diseños de página CSS

From Joomla! Documentation

This page is a translated version of the page About CSS page layouts and the translation is 100% complete.

Other languages:
العربية • ‎বাংলা • ‎Deutsch • ‎English • ‎español • ‎فارسی • ‎français • ‎हिन्दी • ‎Bahasa Indonesia • ‎italiano • ‎Nederlands • ‎Nederlands (informeel)‎ • ‎português • ‎português do Brasil • ‎română • ‎русский • ‎中文(台灣)‎

Sitios web profesionales separan el estilo del contenido. Hay muchas razones para esto, la más obvia (para un desarrollador) la capacidad de controlar la apariencia de muchas páginas con el cambio de un solo archivo. La información de estilo incluye: tipografías; antecedentes; imágenes (que se repiten en cada página), posición y dimensiones de los elementos en la página. El archivo HTML ahora quedará con: información de la cabecera; una serie de elementos; el texto de tu sitio web. Debido a que estás creando la plantilla de un sitio Joomla!, que en realidad tiene: información del encabezado; código php para solicitar el resto de la información de la cabecera; una serie de elementos; código php para la solicitud de cada posición de los módulo; código php para solicitar el contenido principal.

El estilo de la información está codificado en CSS, hojas de estilo en cascada y generalmente se almacenan en archivos con la extensión .css. Una página web contiene un enlace a los archivos asociados .css, por lo que un navegador puede encontrar la información del estilo adecuado para aplicar a la página. CSS también puede ser colocado dentro de un archivo html entre la etiquetas <style type="text/css"></style>.

Todo el código CSS se aplica a un elemento de la página html/xml. Si quieres un estilo para abarcar toda la página, probablemente debas aplicar al elemeto <body>. Puedes aplicar estilos a cualquier elemento html como elementos <p>, <table> o <div>. El estilo de un elemento en particular es necesario que disponga de un ID. Por ejemplo, para aplicar estilos a un <div> que contiene el título, primero tendría que incluir un ID en el html <div ID="title">.