CSS - ayuda en ccs con background

 
Vista:
Imágen de perfil de cesar
Val: 44
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

ayuda en ccs con background

Publicado por cesar (23 intervenciones) el 24/07/2019 02:24:05
Buenas noches amigos
Veo que al usar el background color no me toma el color yellow en ninguno de los backgrounds en este codigo
el bgnd position aqui tampoco pasa nada el right deberia enviarme para la derecha y no lo hace
Como debo corregir esos errores ??? ver la imagen a la derecha y amarilla a no blanca y centrada
Espero su ayuda


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<style>
.box  {
    width: 500px;
    height: 500px;
	margin: 100px auto ;
	background-image: url(https:/drupal.ed.team/sites/default/files/imagenes-cdn-edteam/2018-12/cover-og-image_0.png);
 
background-color: yellow;
content-box: ;
background-size: 100%;
background-position: 50 % 20 %  right ;
}
 
</style>
 
<div class="box">
</div>
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 joel
Val: 870
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

ayuda en ccs con background

Publicado por joel (252 intervenciones) el 24/07/2019 08:11:23
Hola Cesar... te comento...

El color amarillo de fondo si aparece, lo que pasa que la imagen lo tapa... si quitas la imagen lo veras.

el background-position esta mal!! tiene que ser:
- el % no va separado del numero
- lo valores se separan de la posición con una coma.
1
background-position: 50% 20%, right ;
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 cesar
Val: 44
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

ayuda en ccs con background

Publicado por cesar (23 intervenciones) el 24/07/2019 14:00:00
muy bien muy agradecido espero corra normal
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 cesar
Val: 44
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

ayuda en ccs con background

Publicado por cesar (23 intervenciones) el 24/07/2019 14:34:06
buenas amigo lo corro y se ve igual entendido de que la imagen lo tapa pero aca en el position no se desplaza a la derecha
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 joel
Val: 870
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

ayuda en ccs con background

Publicado por joel (252 intervenciones) el 24/07/2019 18:23:00
Cesar, si tienes puesto el background-size: 100%; y la imagen se pepite, no veras actuar el background-position
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 cesar
Val: 44
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

ayuda en ccs con background

Publicado por cesar (23 intervenciones) el 24/07/2019 18:51:10
ok amigo joel yo estudiando por w3 logre hasta el color amarillo solo que con esas imagen al autor del video te da todo vien
El problema es que canbie la imagen y al usar el logo de w3school al copiar la direccion de la imagen me da ese tremrendo codigo como el anexo Hay alguna forma de acortarla?? a su posicion normal
Si go agradecido con ud amigo joel no se ve el codigo completo en el post te lo envio en .rar lo que deseo saber es lo preguntado te agradezco abras el punto.rar
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
<style>
/*  ARCHIVO RECONSTRUIDO POR W3SCHOOLs background-clip: border-box; 40px dotted red; background-origin: content-box;  background-size 100 % ECHA  A PERDER TODO */
 
 
.box  {
 
		 width: 600px;
		 height: 600px;
	     margin: 100px auto ;
 
		 background-image: url (data:image/jpeg;base64,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);
 
 
background-repeat: no-repeat;
  background-attachment: fixed;
  background-position:  right;
  background-color: yellow;
background-origin: content-box;
background-size: 50 %;
 
}
 
	</style>
<div class="box">
 </div>
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 cesar
Val: 44
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

ayuda en ccs con background

Publicado por cesar (23 intervenciones) el 24/07/2019 19:15:18
AProvecho para aclarar esta duda la imagen usada en el bacground i mage debe Por que si Provenir de una URL NO puede ser una imagen proveniente de mis archivos personales fotos etc??? yo lo intente pero queda la imagen fija y no la TOMA COMO CSS EL NAVEGADOR hABRA ALGUNA FORMA QUE NO SEA UN uRL
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