Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » CSS » varios canvas

CSS - varios canvas

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil

varios canvas

Publicado por claudio (5 intervenciones) el 09/02/2016 01:24:02
Amigos:estoy incursionando en html5 y estoy necesitando lo siguiente:

quiero colocar 4 canvas en una pagina escrita en html y no se como posicionarlos para colocarlos donde yo quiera.

estuve tratando de leer algo pero siempre las referencias estan para lo que son los dibujos en el canvas pero no para la ubicacion de varios canvas.

desde ya gracias!
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 624
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

varios canvas

Publicado por xve (490 intervenciones) el 09/02/2016 08:53:34
Hola Claudio, los puedes poner en la web como cualquier otro elemento... ya sea flotante, por posición, sobrepuestos, como tu quieras...

Exactamente como los quieres poner? si nos muestras el código intento mostrarte como hacerlo.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

varios canvas

Publicado por claudio (5 intervenciones) el 11/02/2016 12:19:30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<head>
   <title>Probando canvas</title>
 <style type="text/css">
 
canvas
{
	margin-top:300px;
	margin-left:0px;
	border:double;
	background-color:#0fF;	

}
</style>
</head>
<body>
 
<canvas>
 
</canvas>
</body>
</html>

en la parte de canvas a donde se hace referencia a margenes colores y demas ,no se como colocar un segundo canvas ya que al hacerlo toma el ultimo que escribo.desde ya gracias.

la idea es poner 4 relojes uno en cada canvas y poder ubicarlos en la pagina ejemplo 2 arriba y 2 abajo de los de arriba
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

varios canvas

Publicado por claudio (5 intervenciones) el 13/02/2016 04:18:28
logre que aparezcan los 2 canvas pero...

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE:html>
<head>
   <title>Probando canvas</title>
 
</head>
 
<body>
 
<canvas id="1" width="40" height="60" style="
    background-color: #FFEB3B;

    margin-top: 60px;

">
 
</canvas>
 
 
<canvas id="2" width="80" height="60" style="
    background-color: #FF0000;	

    margin-top:120px;

    margin-left:100px;

">
 
</canvas>
 
</body>
 
</html>

el primero tiene un margin top de 60 px pero toma el valor del de abajo o sea 120 px.hay alguna manera de corregirlo?

desde ya gracias!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve
Val: 624
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

varios canvas

Publicado por xve (490 intervenciones) el 13/02/2016 19:57:08
Hola Claudio, prueba a añadirse al estilo: position:absolute;

Coméntanos, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

varios canvas

Publicado por claudio (5 intervenciones) el 18/02/2016 22:34:46
ok .lo voy a probar y les cuento.gracias por ayudar!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

varios canvas

Publicado por claudio (5 intervenciones) el 23/02/2016 00:59:25
Anduvo!coloque la expresion position absolute y funcionó.

Aunque parezca mentira me baje un monton de manuales de canvas y no vi que hagan referencia a como acomodar manualmente varios canvas.

gracias!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar