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

font-variant            Denotes  whether  a  text  should  p {

                                         be displayed in a small-caps font   font-variant: small-caps;
                                         or not.
                                                                       }
                 font-weight             Indicates how thick or thin  p {
                                         characters  in  text  should  be     font-weight: bold;
                                         displayed.
                                                                       }

                                                                       h1 {
                                                                         font-weight: normal;
                                                                       }
                 font                    It is also feasible to declare all  .para2 {
                                         of the individual font properties     font: italic small-caps  35px
                                         in one property to simplify the   Consolas, serif;
                                         code.
                                                                       }

                   2.21 TEXT MANIPULATION USING CSS

                 CSS has various properties for formatting text. You can set the following text properties of an element:
                         Property                    Usage                                  Example
                 color                    Sets the colour of the text.  h2 {

                                                                         color: green;
                                                                       }
                 text-align               Sets the horizontal alignment of  h2 {
                                          text.                          text-align: center;

                                                                       }
                 direction                Sets  the  text  direction  of  an  p {

                                          element  (ltr  (default):  left  to    direction: rtl;
                                          right, rtl: right to left)
                                                                       }
                 letter-spacing           Used  to indicate  the space  h2 {

                                          between  the  characters  in  a    letter-spacing: 7px;
                                          text.
                                                                       }
                 word-spacing             Sets  the  space  between  the  p {
                                          words in a text                word-spacing: 5px;

                                                                       }
                 text-transform           Can  be  used  to  convert  p.1 {

                                          entire  text  into  uppercase  or   text-transform: uppercase;
                                          lowercase, or capitalize the first   }
                                          letter of each word
                                                                       p.2 {

                                                                         text-transform: capitalize;
                                                                       }









                                                                            Website Development using HTML and CSS   189
   186   187   188   189   190   191   192   193   194   195   196