Lära Utmaning: Implementera Dekorativa Effekter i CSS | Lägga till Dekorativa Effekter med CSS

Uppgift

Öva på att förbättra webbplatsens visuella utseende. Uppgiften omfattar:

Lägg till en skugga på div-elementet med klassnamnet card. De angivna skuggvärdena är

rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px

Lägg till en bakgrundsbild på div-elementet med klassnamnet card. Bildlänken är:

   https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png

index.html

index.css

För att lägga till en skugga på ett element, använd egenskapen box-shadow med det angivna värdet. I detta fall är värdet rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px.
För att ange en bild som bakgrund med egenskapen background-image, använd syntaxen url("correct path"). Inom parenteserna, öppna citattecken och ange sökvägen till bilden. I denna uppgift är den korrekta sökvägen: url("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png").
För att bestämma bakgrundsbildens position, använd egenskapen background-position. I detta fall ska värdet sättas till center för egenskapen.

index.html

index.css

Var allt tydligt?

Tack för dina kommentarer!

Avsnitt 5. Kapitel 6

Fråga AI

Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal

Svep för att visa menyn

Öva på att förbättra webbplatsens visuella utseende. Uppgiften omfattar:

Lägg till en skugga på div-elementet med klassnamnet card. De angivna skuggvärdena är

rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px

Lägg till en bakgrundsbild på div-elementet med klassnamnet card. Bildlänken är:

   https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png

index.html

index.css

För att lägga till en skugga på ett element, använd egenskapen box-shadow med det angivna värdet. I detta fall är värdet rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px.
För att ange en bild som bakgrund med egenskapen background-image, använd syntaxen url("correct path"). Inom parenteserna, öppna citattecken och ange sökvägen till bilden. I denna uppgift är den korrekta sökvägen: url("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png").
För att bestämma bakgrundsbildens position, använd egenskapen background-position. I detta fall ska värdet sättas till center för egenskapen.

index.html

index.css

Var allt tydligt?

Tack för dina kommentarer!

Avsnitt 5. Kapitel 6