Tecnología

Inicio

Cómo cambiar la barra lateral de un sitio web a derecha con códigos CSS

Cómo cambiar la barra lateral de un sitio web a derecha con códigos CSS


Cascading Style Sheets o CSS son esenciales en cada diseño web, ya que contiene la disposición general de los terrenos. Un diseño organizado se basa en la creación de una hoja de estilo centro que indica la ubicación de cada elemento de la página con respecto al otro. Uno de los diseños de página web más comunes es un sitio de dos columnas - uno con una columna principal contenido y una barra lateral. Aunque la mayoría de los diseños tienen la barra lateral a la izquierda, se puede cambiar fácilmente la barra lateral de la derecha, cambiando una de sus propiedades.

Instrucciones

1 Encontrar el nombre de la clase o de identificación usado por la barra lateral de su página. Para ello, puede comprobar el código fuente de la página Web o mediante el uso de herramientas integradas de navegadores como Google Chrome o Firebug de Firefox para inspeccionar el elemento de la barra lateral. Por ejemplo, el nombre de la clase o de identificación usado para la barra lateral de este código es "barra lateral":

<Div class = "barra lateral"> contenido de la barra lateral aquí </ div>

2 Abra el archivo CSS de su página web en el Bloc de notas.

3 Busque la clase o id de la barra lateral usando la herramienta "Buscar" del Bloc de notas o mediante el uso de la tecla "Ctrl + F". En nuestro ejemplo, tendremos que encontrar la clase "barra lateral". Clases en CSS o precedidas de un período, mientras que las identificaciones son precedidos por un signo de número. Un ejemplo de un código de barra lateral CSS puede tener este aspecto:

.sidebar {

flotador izquierdo;

Anchura: 300px;

}

4 Sustituir el valor "flotar" en las propiedades CSS para "derecho" en lugar de "izquierda".

5 Guarde el archivo CSS.

Consejos y advertencias

  • Como no todas las barras laterales están diseñados de la misma. Si no puede cambiar la ubicación de la barra lateral de la izquierda a la derecha, cambiando el valor de coma flotante, tratar de ver si la ubicación de la barra lateral también depende del acolchado se le da en CSS.