Me gusto que Alvaro se tomara el tiempo para explicarnos estos detalles, esta clase 5 del curso la tome como un mini curso de diseño para programadores. Si estamos interesados en el frontend creo que es importante al menos saber algo basico de lo que es el diseño. Gracias.
En el primer ejercicio podemos pasar un string interpolando las variables, dentro de un unquote para que le quite las comillas y listo :D Asi no concatenamos tantos espacios.
Estoy un poco confundido con estas dos palabras, ya que en las clases anteriores aprendimos @extend y funciona muy parecido a lo que estamos aprendiendo en esta clase con los mixins. Cuales son sus principales diferencias y cuando usarlos adecuadamente por separado?
Solo es eso. No fue de mi agrado como la calidad de todas las anteriores.
Mientras exploraba todas las propiedades del Mouse Event, me fije que hay 2 pares de propiedades para las coordenadas que tienen el mismo valor, layer X y layerY son igual que pageX y pageY. De hecho no solo estos dos, tambien hay otros como offset y client, alguien tienen una respuesta para esto?
Estuve leyendo un poco la MDN de mozilla y al parecer tambien existe innerText pero aun no me queda clara sus deiferencias, cuando usar una y cuando otra? Se que con el tiempo y la practica lo voy a manejar pero si alguien sabe o tiene un concepto facil de entender lo agradeceria. Saludos.
Por esto me gusta EDteam, explican cada concepto con profundidad, muy importantes primero para tener claro los fundamentos antes de ir a la practica.
Estoy muy confundido con eso de "var" y "let". Por que ya no se usa? Si yo vengo de un lenguaje como C# donde el punto y coma es obligatorio, y lo quiero usar en Js es considerado mala practica? Quiero argumento valido para dejar de usar var y acostumbrarme a usar let. En 2020.
Hoy por hoy JS es un lenguaje muy poderoso. Me encanta.
Yo lo hice un poco diferente ya que mi imagen es muy grande y debia ajustarla al tamaño de mi contenedor, pero me salio el mismo resultado. Excelente clase, felicidades y gracias a EdTeam por tan buen trabajo.
HTML
<div class="card">
<div class="text-background">
<p class="card-title">Welcome</p>
</div>
</div>
CSS
.card{
position: relative;
width: 30%;
height: 80%;
background-image: url(./images/cody-lannom-aeYQSnN4dOo-unsplash.jpg);
background-size: cover;
margin-left: 4.5em;
border: solid .4em <a href="/comunidad/publicaciones?q=%23fff" data-community-hashtag="true">#fff</a>;
}
.text-background{
width: 100%;
height: 10%;
position: absolute;
top: 90%;
background-color: rgba(0, 0, 0, .65);
color: <a href="/comunidad/publicaciones?q=%23fff" data-community-hashtag="true">#fff</a>;
display: flex;
justify-content: center;
align-items: center;
font-size: 1.4em;
}