miércoles, 22 de abril de 2015

Centrar un DIV

1.- Crearemos un nuevo archivo HTML.

2.- Desde el panel de Inserciones seleccionamos la siguiente opción y arrastramos a la ventana de documento:



3.- Visualizaremos el siguiente cuadro:


4.- Solo ingresaremos el ID del DIV y lo nombraremos "Contenedor":


5.- Presionamos "Nueva regla CSS" visualizaremos la siguiente ventana de dialogo:


6.- Presionamos aceptar y visualziaremos las opciones para nuestra regla CSS:


7.- Seleccionamos fondo y seleccionaremos el siguinete color:


8.- Seleccionaremos Cuadro y dejaremos las siguientes opciones:


9.- Presionaremos "Aceptar" y Aceptar, el siguiente debe ser el resultado:



10.- El código fuente es el siguiente:


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CentrarDIV</title>
<style type="text/css">
#Contenedor {
background-color: #F30;
height: 600px;
width: 800px;
margin-right: auto;
margin-left: auto;
}
</style>
</head>

<body>
<div id="Contenedor">Colocar aquí el contenido para  id "Contenedor"</div>
</body>
</html>

11.- El siguiente es el resultado en el navegador:













No hay comentarios:

Publicar un comentario