Basic HTML Version

|  | Table of Contents |  | View Full Version

Page 79 - 2629_Devagiri_C-7
P. 79

    Ask
                                                                          AGENT
                                                           OrangeAI
                      Create an HTML document with the title Gymnastics. Add styling properties like colour, background
                      colour, etc.

                              Study

                            BACKGROUND PROPERTIES

                     CSS background properties style and control element backgrounds. The table shows properties,
                     values and descriptions:

                           Property Name                        Value                            Description
                     BACKGROUND-COLOR              Any valid colour value (name,  This property sets the background
                                                   HEX, RGB, HSL, etc.)              colour of an element.

                     BACKGROUND-IMAGE              URL of image                      This property sets an image as the
                                                                                     background of an element.

                     BACKGROUND-REPEAT             REPEAT, NO-REPEAT,                This property  determines how
                                                   REPEAT-X, REPEAT-Y                background images are repeated.
                     BACKGROUND-POSITION           LEFT, RIGHT, TOP, BOTTOM,         This property sets the position of
                                                   CENTER or COORDINATES             the background image.
                     BACKGROUND-SIZE               CONTAIN, COVER, AUTO,             This property specifies the size of
                                                   HEIGHT/WIDTH in PX or %           the background within an element.

                        Code
                          4      Write the HTML code to present the given web page using background properties.

                     <!DOCTYPE HTML>
                     <HTML>

                     <HEAD>                                                              In CSS,  1 inch is  equal  to  96
                                                                                         pixels.
                     <TITLE>Using Background Properties</TITLE>

                     </HEAD>
                     <BODY STYLE="BACKGROUND-IMAGE: URL('astronaut.jpg');

                     BACKGROUND-SIZE: 500px 500px;">
                     <H1 STYLE="

                     BACKGROUND-COLOR: MEDIUMPURPLE;">
                     Exploring the Universe</H1>

                     </BODY>
                     </HTML>
                     Note: Ensure that the astronaut.jpg file is in the same folder as the HTML file.

                                                                                                                      77
                                                                                                    CSS3–Styling Basics

| 74 75 76 77 78 79 80 81 82 83 84 |