styles.css 1.0 KB

1234567891011121314151617181920212223
  1. .box {
  2. width: 300px;
  3. height: 200px;
  4. border: 1px solid black;
  5. background-color: yellow;
  6. background-repeat: no-repeat;
  7. background-image: url(https://www.mundodeportivo.com/alfabeta/hero/2022/05/Dragon-Ball-confirma-a-que-personaje-Goku-nunca-podra-ganarle.jpg),
  8. url(https://images.unsplash.com/photo-1528722828814-77b9b83aafb2?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D);
  9. /* background-size: 50%, 60%; */
  10. background-size: 50%;
  11. background-position: 0 0, right 0;
  12. /* Equivalente */
  13. background: url(https://www.mundodeportivo.com/alfabeta/hero/2022/05/Dragon-Ball-confirma-a-que-personaje-Goku-nunca-podra-ganarle.jpg) 0 0 / 50% no-repeat,
  14. url(https://images.unsplash.com/photo-1528722828814-77b9b83aafb2?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D) right 0 / 50% no-repeat,
  15. yellow;
  16. background-repeat: no-repeat;
  17. }