Page 147 - Computer Genius Class 07
P. 147

Inline Style Sheet

                 An inline style is used to apply a uni ue style  or a single element.  t allo s you to create and apply
                 a style on the element. Syntax to create an inline style is:

                 <element style = “property1:value1; property2:value2; … ….”>

                 Where, element is any valid HTML tag and the style is the global attribute of HTML used by all the
                 tags of HTML. The style attribute contains all the CSS properties and their values within double
                  uotes. For e ample

                 <body style=”background-color:green; color:white”>
                 Text in white colour

                 </body>

                 Internal Style Sheet

                 CSS design can also be applied into an HTML document by using <STYLE> tag. This tag should be
                 placed inside the    AD  and     AD  tags. An internal style sheet is commonly used  hen one
                  e  page has a uni ue style. For e ample

                 <head>

                 <style>
                 body{background-color:green; color:white;}

                 </style>
                 </head>

                 <body>

                 Text in white colour
                 </body>

                 External Style Sheet

                  n case o  e ternal stylesheet  the  SS styles are  ritten in a separate file  hich is sa ed  ith .css
                 e tension.  ou need to include a re erence to the e ternal style sheet file  ithin the        element
                 inside the    AD  element. Synta  to include the re erence o  e ternal stylesheet is

                 <head>

                 <link rel=“stylesheet” type=“text/css” href=“name of style sheet”>
                 </head>

                  here     F attri ute contains the path o  the stylesheet. For e ample  i  you ha e sa ed the file in
                 which styles are written with the name style.css, then the code will be:
                 <head>

                 <link rel=“stylesheet” type=“text/css” href=”style.css”>

                 </head>

                                                                                             HTML5 & CSS3     145
   142   143   144   145   146   147   148   149   150   151   152