Mostrar Mensajes

Esta sección te permite ver todos los posts escritos por este usuario. Ten en cuenta que sólo puedes ver los posts escritos en zonas a las que tienes acceso en este momento.

Mensajes - Elanti

Páginas: 1 [2]

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / ¿Qué son el div id=SL_shadow_translator, y otros elementos?

« en: 04 de Junio 2015, 23:59 »

Hola:

Esta es una duda que yo tengo, referido a algo curioso que ya me ha ocurrido en más de una lección del curso CSS.

Digamos, por ejemplo, que estoy estudiando la lección CU01035D. Al cargar en el navegador los códigos que se ofrecen en la lección (y hacerles las modificaciones que se indican), inicialmente logro visualizarlos correctamente, tal como se muestran en la página del curso. Al hacer click en la pantalla, aparecen elementos que no están en el código, como una barra que se observa en la parte inferior. Al recargar la página, estos elementos extraños desaparecen. Si inspecciono la página con el inspector de elementos del navegador, veo que estos elementos tienen nombre y propiedades; por ejemplo, en este caso, dice llamarse: <div id=SL_shadow_translator>.

¿De dónde salen estos elementos, y quién les pone nombre?

Gracias.

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Re:CSS position relative y absolute diferencias y ejemplos Ejercicio CU01032D

« en: 03 de Junio 2015, 18:33 »

¡Ja,ja,ja! Ya encontré el error. En el link al archivo CSS, donde dice:

<link type="text/CCS" rel="stylesheet" href="estilosposition.css"/>

debería decir:

<link type="text/CSS" rel="stylesheet" href="estilosposition.css"/>

Una letra de diferencia. A Chrome no le importaba, pero a los otros navegadores, sí.
¡Gracias!

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Re:CSS position relative y absolute diferencias y ejemplos Ejercicio CU01032D

« en: 03 de Junio 2015, 17:46 »

Sí, el que pusiste tú sí lo puedo ver en Firefox, pero tiene el CSS adentro del HTML. El problema que tengo con este ejercicio en particular, aparece cuando separo el CSS y el HTML en dos archivos diferentes.
Mi Firefox no está actualizado, pero aún así es capaz de mostrar este ejercicio cuando le inserto el CSS dentro del HTML. Por otra parte, no sé si será un código tan complicado para requerir una versión más reciente del navegador. No sé…

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Re:data URL image base64 ¿Para qué sirve? Ventajas e inconvenientes CU01031D

« en: 03 de Junio 2015, 16:09 »

Hola, Ogramar:
No tenía idea de que los "id" tenían que comenzar necesariamente por letras. Tomo nota de eso.
Con respecto a las imágenes, no fue algo intencional. Yo simplemente hice una búsqueda en Google, y luego haciendo click derecho y seleccionando "copiar la ruta de la imagen", me quedó de esa manera. No tenía idea de que estaba usando una técnica diferente, aunque sí noté que se veían extrañas las direcciones (pero funcionaban). Muchas gracias por la información, es bueno saberlo.
Saludos.

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Re:CSS position relative y absolute diferencias y ejemplos Ejercicio CU01032D

« en: 03 de Junio 2015, 15:58 »

Hola, Ogramar:
Muchas gracias por tomarte la molestia de revisar mis respuestas.
Efectivamente, con el código CSS insertado dentro del HTML puedo ver el ejercicio 1 en cualquier navegador… pero cuando los separo, sólo Chrome es capaz de mostrarlo. Hice el intento de quitarle la barra final, como me dijiste, pero fue inútil. Lo extraño es que no me había ocurrido esto con ninguno de los ejercicios anteriores.
El ejercicio 2, tal vez no comprendí cómo tenía que ser exactamente el resultado final, pero me quedo tranquilo de que supe utilizar bien la propiedad "position".
Muchas gracias nuevamente.
Saludos.

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Propiedad position CSS (CU01032D), ejercicio 2

« en: 03 de Junio 2015, 06:36 »

Citar

EJERCICIO 2

Define un documento HTML con 3 cajas contenedoras div (div1, div2 y div3), la primera con unas dimensiones de 600x600px y un background color amarillo. La segunda con dimensiones 400x400px y un background color verde. La tercera con dimensiones 100x100px y background color azul. Usando posicionamiento absoluto establece para el div2 y el div3 el mismo origen que para el div1, de modo que el efecto generado sea ver un cuadrado amarillo dentro del cual hay un cuadrado verde dentro del cual hay un cuadrado azul. Para comprobar si tus respuestas son correctas puedes consultar en los foros aprenderaprogramar.com.

A este ejercicio yo lo resolví utilizando dos métodos diferentes, que me dieron un resultado casi idéntico (en ambos casos, los elementos div se visualizan en forma concéntrica).

MÉTODO 1:

Código: [Seleccionar]

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>ejercicio2position</title>
<link rel="stylesheet" type="text/CSS" href="ej2positionMetodo1.css"/>
</head>
<body>
 <div id="grande"></div>
 <div id="mediana"></div>
 <div id="chica"></div>
</body>
</html>

Código: [Seleccionar]

#grande{ width:600px;
         height:600px;
         background-color:yellow;
         position:absolute;left:200px;top:0px;         
}
#mediana{width:400px;
         height:400px;
         background-color:green;
         position:absolute;left:300px;top:100px;         
         }
#chica{width:100px;
       height:100px;
       background-color:blue;
       Position:absolute;left:450px;top:250px;
       }

MÉTODO 2:

Código: [Seleccionar]

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8"/>
<title>Ejercicio 2 Position (Método 2)</title>
<link rel="stylesheet" type="text/CSS" href="ej2positionMetodo2.css"/>
</head>
<body>
 <div id="grande">
  <div id="mediana">
   <div id="chica">
   </div>
  </div>
 </div>
</body>
</html>

Código: [Seleccionar]

#grande{width:600px;
        height:600px;
        background-color:yellow;
        position:absolute;left:200px;
        }
#mediana{width:400px;
         height:400px;
         background-color:green;
         position:absolute;left:100px;top:100px;
         }
#chica{width:100px;
       height:100px;
       background-color:blue;
       position:absolute;left:150px;top:150px;
       }

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / CSS position relative y absolute diferencias y ejemplos Ejercicio CU01032D

« en: 03 de Junio 2015, 03:56 »

Hola:

Este ejercicio no me pareció particularmente difícil, pero me desconcierta el hecho de que sólo puedo visualizar mi respuesta en Chrome. El resto de los navegadores que he probado (Firefox, Explorer y Opera) sólo me muestran una página en blanco. Agradecería si alguien me pudiera decir qué es lo que estoy haciendo mal.

Citar

EJERCICIO 1

Define un documento HTML con un div padre (divPadre), dentro del cual existan otras 3 cajas contenedoras div (div1, div2 y div3), cada una de ellas con unas dimensiones de 300x300px, 40 píxeles de margin en todas direcciones, 30 píxeles de padding en todas direcciones y un background color diferente. Usando posicionamiento relativo genera un desplazamiento de los div de la siguiente manera:

a) El div 1 deberá desplazarse 200 píxeles a la derecha y 100 píxeles hacia abajo respecto a lo que sería su posición normal.

b) El div 2 deberá desplazarse 50 píxeles a la izquierda y 50 píxeles hacia arriba respecto a lo que sería su posición normal.

c) El div 3 deberá desplazarse 450 píxeles a la derecha y 300 píxeles hacia arriba respecto a lo que sería su posición normal.

Mi código HTML:

Código: [Seleccionar]

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Ejercicio propiedad position</title>
<link type="text/CCS" rel="stylesheet" href="estilosposition.css"/>
</head>
<body>
<div id="DivPadre">
 <div id="div1"></div>
 <div id="div2"></div>
 <div id="div3"></div>
</div>
</body>
</html>

Mi hoja de estilos:

Código: [Seleccionar]

#DivPadre{border:solid 5px green;
}
div div{width:300px;
      height:300px;
      margin:40px;
      padding:30px;
}
#div1{background-color:magenta;
      position:relative;left:200px;top:100px;
} 
#div2{background-color:cyan;
      position:relative;right:50px;bottom:50px; 
}
#div3{background-color:skyblue;
      position:relative;left:450px;bottom:300px;
}

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / data URL image base64 ¿Para qué sirve? Ventajas e inconvenientes CU01031D

« en: 02 de Junio 2015, 21:05 »

Hola:

Citar

EJERCICIO

Crea un documento HTML con 4 elementos div de 400 píxeles de ancho y 400 píxeles de alto, todos ellos con un margin de 40 píxeles en todas direcciones y un padding de 40 píxeles en todas direcciones. En cada uno de los elementos div crea un borde y coloca una imagen de fondo diferente y un background-color diferente. Usa la propiedad background-position para hacer que la imagen esté centrada tanto vertical como horizontalmente respecto al borde del div (por ejemplo, si una imagen mide 100x100 píxeles, deberá existir la misma distancia hasta el borde del div en las cuatro direcciones).

Yo lo resolví de la siguienta manera:

HTML

Código: [Seleccionar]

<!DOCTYPE html/>
<html lang="es">
<html>
<title>Ejercicio background</title>
<meta charset="UTF-8"/>
<link rel="stylesheet" type="text/CSS" href="ejerciciobackground.css"/> 
<head>
</head>
<body>
<div id="primero"></div>
<div id="segundo"></div>
<div id="tercero"></div>
<div id="cuarto"></div>

</body>
</html>

CSS

Código: [Seleccionar]

div{
   width:400px;
   height:400px;
   margin:40px;
   padding:40px; 
   background-repeat:no-repeat;
   background-position:50% 50%;
     
}
#primero{
    background-image:url(data:image/jpeg;base64,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);
    background-color:orange;
    border:solid 5px blue;
    
}
#segundo{background-image:url(data:image/jpeg;base64,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);
   background-color:cyan;
   border:dotted 3px #FF0000;
}
#tercero{background-image:url(data:image/jpeg;base64,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);
   background-color:lightgreen; 
   border:dashed 7px #00DD00;
}
#cuarto{background-image:url(data:image/jpeg;base64,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);
   background-color:yellow;
   border:groove 10px #0000EE;
   }

Una cosa que me resultó extraña, es que inicialmente yo había identificado los elementos div utilizando números simples (1,2,3 y 4) y no lograba visualizarlos en el navegador. Sólo cuando les cambié los id a "primero, segundo, etc.", pude visualizarlos. No sé cuál puede ser la causa de esto.

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Re:CSS ¿qué significa em? Ancho o width medido en em unidad relativa (CU01025D)

« en: 02 de Junio 2015, 15:14 »

Perfecto, comprendido. ¡Muchas gracias!

C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / CSS ¿qué significa em? Ancho o width medido en em unidad relativa (CU01025D)

« en: 01 de Junio 2015, 02:09 »

Hola a todos:

Soy principiante total, y me está resultando de gran utilidad el tutorial de CSS. Está muy bien escrito, y todo está explicado de forma muy didáctica y amena.

Sin embargo, no estoy entendiendo bien el ejemplo práctico de la entrega nº25 del tutorial (CU01025D). Allí se establece que el elemento h2 tenga un width de 8em. Según entiendo, esto significaría que el elemento h2 debería tener un ancho equivalente a 8 veces el tamaño de la fuente. O sea, deberían caber dentro de ese elemento 8 caracteres de tamaño normal de fuente. Sin embargo, se aprecia claramente que el elemento tiene un ancho mucho mayor, ya que contiene la frase "la programación", que tiene una longitud de 15 caracteres... ¿Qué es lo que no estoy comprendiendo bien?

Páginas: 1 [2]

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: