Grokking CSS for Web Development
Vote

0% completed

​

Background Shorthand

Compare two ways of giving the travel card its background. The first uses the three separate properties from the previous lessons:

.card {
  background-color: #fff8e7;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><circle cx='20' cy='20' r='5' fill='orange'/></svg>");
  background-repeat: repeat-x;
}

The second uses one property, background:

.card {
  background: #fff8e7 url("data:image/svg+xml,<svg xmlns='http://www.w3

.....

.....

.....

Like the course? Get enrolled and start learning!

Reading Progress

0%

Vote for new content