Help me solve this task. Insert the following declarations to the style rule for the square class selector. For each declaration, you must first include a declaration with the -webkit- prefix, followed by the standard declaration. Animation name property that specifies the name of the @keyframes rule animation. Animation duration property with a value of 5 seconds. MY CSS /* CSS reset */ body, header, main, section, footer, h1, h2 { margin: 0; padding: 0; border: 0; } /* Style rule for body */ body { background-color: #f0d8d1; } /* Style rules for header */ header { padding: 3%; text-align: center; font-size: 1.5em; font-weight: bold; } /* Style rules for main content area */ main { font-family: Verdana, Arial, sans-serif; font-size: 1em; margin: 0 2%; padding: 1em; background-color: #fff; border: 5px double #33091b; padding: 2%; } h2 { padding-bottom: 1%; } section { margin-bottom: 3%; } button { height: 3em; font-size: 1em; } .square { width: 200px; height: 200px; background-color: #33091b; margin-left: 6%; -webkit-animation-name: text-animation,color; animation-name: text-animation,color; -webkit-animation-duration: 5s; animation-duration: 5s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } @-webkit-keyframes text-animation { 0%{font-size: 1em;} 50%{font-size: 2em;} 100%{font-size: 1.35em;} } @keyframes text-animation { 0%{font-size: 1em;} 50%{font-size: 2em;} 100%{font-size: 1.35em;} } /* Animation */ @-webkit-keyframes color { from { background-color: #fbdae9; } to { background-color: #660b32; } } @keyframes color { from { background-color: #fbdae9; } to { background-color: #660b32; } } /* Style rules for the footer */ footer { font-size: .90em; text-align: center; margin-top: 2em; }

Help me solve this task. Insert the following declarations to the style rule for the square class selector. For each declaration, you must first include a declaration with the -webkit- prefix, followed by the standard declaration. Animation name property that specifies the name of the @keyframes rule animation. Animation duration property with a value of 5 seconds. MY CSS /* CSS reset / body, header, main, section, footer, h1, h2 { margin: 0; padding: 0; border: 0; } / Style rule for body / body { background-color: #f0d8d1; } / Style rules for header / header { padding: 3%; text-align: center; font-size: 1.5em; font-weight: bold; } / Style rules for main content area / main { font-family: Verdana, Arial, sans-serif; font-size: 1em; margin: 0 2%; padding: 1em; background-color: #fff; border: 5px double #33091b; padding: 2%; } h2 { padding-bottom: 1%; } section { margin-bottom: 3%; } button { height: 3em; font-size: 1em; } .square { width: 200px; height: 200px; background-color: #33091b; margin-left: 6%; -webkit-animation-name: text-animation,color; animation-name: text-animation,color; -webkit-animation-duration: 5s; animation-duration: 5s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } @-webkit-keyframes text-animation { 0%{font-size: 1em;} 50%{font-size: 2em;} 100%{font-size: 1.35em;} } @keyframes text-animation { 0%{font-size: 1em;} 50%{font-size: 2em;} 100%{font-size: 1.35em;} } / Animation / @-webkit-keyframes color { from { background-color: #fbdae9; } to { background-color: #660b32; } } @keyframes color { from { background-color: #fbdae9; } to { background-color: #660b32; } } / Style rules for the footer */ footer { font-size: .90em; text-align: center; margin-top: 2em; }

Database System Concepts

7th Edition

ISBN:9780078022159

Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan

Publisher:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan

Chapter1: Introduction

Section: Chapter Questions

Problem 1PE

See similar textbooks

Related questions

Question

Help me solve this task.

Insert the following declarations to the style rule for the square class selector. For each declaration, you must first include a declaration with the -webkit- prefix, followed by the standard declaration.

Animation name property that specifies the name of the @keyframes rule animation.
Animation duration property with a value of 5 seconds.

MY CSS

/* CSS reset */

body, header, main, section, footer, h1, h2 {

margin: 0;

padding: 0;

border: 0;

}

/* Style rule for body */

body {

background-color: #f0d8d1;

}

/* Style rules for header */

header {

padding: 3%;

text-align: center;

font-size: 1.5em;

font-weight: bold;

}

/* Style rules for main content area */

main {

font-family: Verdana, Arial, sans-serif;

font-size: 1em;

margin: 0 2%;

padding: 1em;

background-color: #fff;

border: 5px double #33091b;

padding: 2%;

}

h2 {

padding-bottom: 1%;

}

section {

margin-bottom: 3%;

}

button {

height: 3em;

font-size: 1em;

}

.square {

width: 200px;

height: 200px;

background-color: #33091b;

margin-left: 6%;

-webkit-animation-name: text-animation,color;

animation-name: text-animation,color;

-webkit-animation-duration: 5s;

animation-duration: 5s;

-webkit-animation-iteration-count: infinite;

animation-iteration-count: infinite;

}

@-webkit-keyframes text-animation {

0%{font-size: 1em;}

50%{font-size: 2em;}

100%{font-size: 1.35em;}

}

@keyframes text-animation {

0%{font-size: 1em;}

50%{font-size: 2em;}

100%{font-size: 1.35em;}

}

/* Animation */

@-webkit-keyframes color {

from { background-color: #fbdae9; }

to { background-color: #660b32; }

}

@keyframes color {

from { background-color: #fbdae9; }

to { background-color: #660b32; }

}

/* Style rules for the footer */

footer {

font-size: .90em;

text-align: center;

margin-top: 2em;

}

Expert Solution

Trending now

This is a popular solution!

Step by step

Solved in 2 steps with 2 images

SEE SOLUTION Check out a sample Q&A here

Knowledge Booster

Learn more about

Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.