Uso de la clase de hoja de estilos en cascada para SharePoint Foundation
Última modificación: sábado, 01 de mayo de 2010
Hace referencia a: SharePoint Foundation 2010
Las hojas de estilos en cascada (CSS) definen reglas de estilo que un programador puede aplicar en los elementos de una página web. Por ejemplo, los estilos CSS pueden definir cómo se muestran los elementos y dónde se posicionan en la página. Se puede usar CSS junto con ECMAScript (JavaScript, JScript) y los elementos HTML definidos en la página maestra (v4.master) y las páginas individuales para personalizar la presentación de los sitios web de Microsoft SharePoint Foundation.
Elementos de la página principal del sitio de grupo y clases CSS
En la siguiente tabla se resumen los elementos de nivel superior seleccionados y los estilos CSS que se usan en la página principal del sitio de grupo predeterminado. Use esta tabla como punto de partida para comprender cómo usar las hojas de estilos en cascada para personalizar SharePoint Foundation. Para obtener más información, vea el artículo sobre hojas de estilos en cascada.
Elemento |
Clases CSS |
Notas |
---|---|---|
<body> |
v4master |
Aplica estilos CSS en corev4.css a la página. |
Contenedor de la cinta de opciones |
s4-pr |
Hace que el contenedor de la cinta de opciones sea el ancho completo de la fila de la página. |
s4-ribbonrowhidetitle |
Se usa para mostrar u ocultar el área de título de la cinta de opciones cuando se abre o se cierra la cinta de opciones. |
|
ms-cui-ribbon |
Define la clase CSS principal de la cinta de opciones. |
|
ms-cui-ribbonTopBars |
Define los elementos por encima del cuerpo de la cinta de opciones, desde la parte superior de la página hasta los títulos de ficha de la cinta de opciones. |
|
Menú Acciones del sitio |
ms-siteactionsmenu |
Establece estilos para el menú Acciones del sitio en su conjunto. |
ms-siteactionsmenuinner |
Establece estilos para el menú interno Acciones del sitio. |
|
ms-menu-a |
Establece la propiedad margin-right en el menú superior. |
|
Menú de ruta de navegación |
s4-breadcrumb-menu |
Establece estilos para el menú de ruta de navegación en su conjunto. |
s4-breadcrumb-anchor |
Establece estilos al mantener el mouse sobre el menú de ruta de navegación. |
|
Encabezado del menú de ruta de navegación |
s4-breadcrumb-top |
Establece estilos en el área superior del menú de ruta de navegación cuando se abre el árbol de la lista desplegable. |
s4-breadcrumb-header |
Establece estilos en el icono de la carpeta de ruta de navegación cuando se selecciona el menú desplegable del árbol de ruta de navegación. |
|
Elementos del menú de ruta de navegación |
s4-breadcrumb |
Establece los estilos del elemento de ruta de navegación. |
s4-breadcrumbRootNode |
Establece estilos en el elemento del árbol de raíz del sitio de grupo de ruta de navegación. |
|
s4-breadcrumbCurrentNode |
Establece estilos en el elemento del árbol principal de ruta de navegación. |
|
Ficha Editar |
ms-qatbutton |
Establece estilos en la ficha Editar. |
Ficha Examinar |
ms-cui-tts |
Establece estilos para el contenedor del título de la ficha. |
ms-cui-tt |
Establece estilos para el título de la ficha. |
|
ms-browseTab |
Establece estilos específicos a la ficha Examinar |
|
ms-cui-tt-s |
Establece estilos para el título de una ficha seleccionada. |
|
ms-cui-tt-a |
Establece estilos para el delimitador del título de ficha de la cinta de opciones (el elemento de vínculo que hace que se pueda hacer clic en el título de la tabla). |
|
ms-cui-tt-span |
Establece estilos para el intervalo del título de ficha. |
|
Ficha de página |
ms-cui-tt |
Establece estilos para el título de la ficha. |
ms-cui-tt-a |
Establece estilos para el delimitador del título de ficha de la cinta de opciones (el elemento de vínculo que hace que se pueda hacer clic en el título de la tabla). |
|
ms-cui-tt-span |
Establece estilos para el intervalo del título de ficha. |
|
Menú de usuario |
s4-trc-container-menu |
Establece estilos para el menú de contenedor de la esquina superior derecha. |
ms-SPLink |
Establece estilos aplicados a un elemento de menú. |
|
ms-welcomeMenu |
Establece la propiedad de margen derecho en un elemento de menú desplegable. |
|
ms-menu-a |
Establece la propiedad margin-right en el menú superior. |
|
Fila de título |
s4-pr |
Hace que el título de la ficha sea el ancho completo de la fila de la página. |
s4-title |
Establece estilos en los elementos de título de página. |
|
s4-lp |
Establece estilos para los elementos en la parte izquierda de la página. |
|
s4-titlelogo |
Establece el margen y la alineación de la imagen del logotipo de título. |
|
s4-titletext |
Establece estilos en todo el texto a la derecha del gráfico del logotipo de la página. |
|
Área de búsqueda |
s4-search |
Establece valores de relleno en el control de búsqueda del menú secundario. |
s4-rp |
Establece estilos para los elementos en la parte derecha de la página. |
|
Elementos de menú de inicio rápido |
menu-item |
Establece estilos para el botón de inicio ubicado bajo el logotipo del sitio. |
menu-item-text |
Establece estilos en el texto del botón de inicio. |
|
Vínculo de la papelera de reciclaje |
s4-rcycl |
Establece estilos específicos para el elemento de vínculo de la papelera de reciclaje. |
ms-splinkbutton-text |
Establece estilos en el elemento de vínculo. |
|
Vínculo Todo el contenido del sitio |
s4-specialNavIcon |
Establece estilos específicos al elemento de vínculo Todo el contenido del sitio |
ms-splinkbutton-text |
Establece estilos en el elemento de vínculo. |
|
Vínculo Documentos compartidos |
ms-WPHeaderTd |
Establece estilos en la sección de encabezado del elemento web. |
ms-standardheader |
Establece estilos de encabezado estándar. |
|
ms-WPTitle |
Establece estilos en el título del elemento web. |
|
Menú del elemento web |
ms-WPHeaderTdMenu |
Establece estilos en el menú del elemento web. |
ms-WPHeaderMenuImg |
Establece estilos en la imagen del menú del elemento web. |
|
Casilla de selección |
ms-WPHeaderTdSelection |
Establece estilos en la casilla de selección del elemento web. |
ms-WPHeaderTdSelSpan |
Establece estilos span en la casilla de selección del elemento web. |
|
Casilla de selección de elementos |
ms-vh-icon |
Establece estilos en el icono de la casilla de selección de elementos. |
ms-vh2 |
Establece el alto de la propiedad. |
|
Opción de tipo, opción de nombre, opción Modificado, opción Modificado por |
ms-vh-div |
Establece la propiedad padding-top. |
s4-ctx |
Establece propiedades de presentación, posición y relleno en el menú desplegable. |
|
ms-vh2 |
Establece el alto de la propiedad. |
|
Texto de documentos compartidos |
ms-vb |
Establece estilos en el área de texto del grupo de control de documentos compartidos (parte inferior del grupo). |
Vínculo Agregar documento |
ms-addnew |
Establece estilos especificados para el vínculo Agregar documento. |
Imagen de foto |
ms-rte-layoutszone-outer. |
Clase de editor de texto enriquecido que establece la propiedad float en los controles del elemento web principal del sitio de grupo. |
ms-rte-layoutszone-inner |
Clase de editor de texto enriquecido que establece estilos en áreas de contenido del elemento web principal del sitio de grupo. |
|
ms-rteThemeForeColor-5-5 |
Clase de editor de texto enriquecido que establece el color de primer plano del tema (en azul marino) en el área Wiki de introducción. |
|
Área de introducción |
ms-rte-layoutszone-outer. |
Clase de editor de texto enriquecido que establece la propiedad float en los controles del elemento web principal del sitio de grupo. |
ms-rte-layoutszone-inner |
Clase de editor de texto enriquecido que establece estilos en áreas de contenido del elemento web principal del sitio de grupo. |
|
ms-rteThemeForeColor-5-5 |
Clase de editor de texto enriquecido que establece el color de primer plano del tema (en azul marino) en el área Wiki de introducción. |
|
Vínculos Compartir este sitio, Cambiar tema del sitio, Establecer icono del sitio, Personalizar inicio rápido |
ms-rteTable-0, ms-rteTableEvenRow-0, ms-rteTableEvenCol-0, ms-rteTableOddCol-0, ms-rteTableOddRow-0 |
Clases de editor de texto enriquecido que establecen estilos en los controles del área wiki de introducción. |