Basic HTML Version

|  | Table of Contents |  | View Full Version

Page 113 - 2617_JSSPS_C-6
P. 113

    Inline Style Sheet

                     An inline style is used to apply a unique style to a single element. It allows you to create and apply a
                     style directly to 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 the CSS properties and their values within double quotes. For
                     example:

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

                     </body>
                     Internal Style Sheet

                     CSS design can also be applied to an HTML document by using <STYLE> tag. This tag should be placed

                     inside the <HEAD> and </HEAD> tags. An internal style sheet is commonly used when one web page
                     has a unique style. For example:

                     <head>

                     <style>
                     body{background-color:green; color:white;}
                                                                                               CSS is like the colour and
                     </style>
                                                                                            texture of a flower or leaf, which
                     </head>                                                                  enhances the plant's visual
                                                                                                       appeal.
                     <body>

                     Text in white colour
                     </body>

                     External Style Sheet

                     In case of external stylesheet, the CSS styles are written in a separate file which is saved with .css
                     extension. You need to include a reference to the external style sheet file within the <LINK> element
                     inside the <HEAD> element. Syntax to include the reference of the external stylesheet is:

                     <head>

                     <link rel="stylesheet" type="text/css" href="name of style sheet file">
                     </head>
                     Where, HREF attribute contains the path of the stylesheet. For example, if you have saved the file with

                     the styles as style.css, then the code will be:

                     <head>
                     <link rel="stylesheet" type="text/css" href="style.css">

                     </head>

                                                                                        Introduction to HTML5 & CSS3   111

| 108 109 110 111 112 113 114 115 116 117 118 |