Page 190 - Web Applications (803) Class 11
P. 190

2.19 CSS BACKGROUND IMAGE

              The various attributes can be used to add a background image to a webpage:
                      Property                    Usage                                  Example

               background-image        Specifies an image to be used   body {
                                       as an element's backdrop. The
                                       image is repeated by default,     background-image: url("abc.jpg");
                                       covering the full element.    }
               background-repeat       The images can be set to repeat  Horizontal Repeat:
                                       vertically or horizontally    body {

                                                                       background-image: url("PQR.png");
                                                                       background-repeat: repeat-x;
                                                                     }
                                                                     Vertical Repeat – Set

                                                                     background-repeat: repeat-y;
                                                                     Not to repeat: Set background-repeat: no-
                                                                     repeat;
               background-position     Used to determine  where the  body {

                                       background  graphic  should  be   background-image: url("PQR.png");
                                       placed.                       background-position: right top;

                                                                     }
               background-attachment   Determines whether or not the  body {

                                       background image should scroll    background-image: url("PQR.png");
                                       with the rest of the page       background-position: right top;

                                                                       background-attachment: fixed;
                                                                     }
                 2.20 CSS FONTS

              You can set fonts of any content available in an HTML element. You can set following font properties of an element:

                      Property                    Usage                                   Example
               font-family             Sets the font of text         .para1 {
                                                                       font-family: "Times New Roman",
                                                                     Georgia, Consolas;

                                                                     }
                                                                     depends on which font you have in
                                                                     your system.
               font-style              Specify   normal/italic/oblique  .para1 {
                                       text                            font-style: oblique;

                                                                     }
               font-size               Sets text/font size           h1 {
                                                                       font-size: 20px;

                                                                     }




                188     Touchpad Web Applications-XI
   185   186   187   188   189   190   191   192   193   194   195