Web Technologies - Old Questions

7.  How can you insert external style sheets in your HTML document? Discuss with example.

5 marks | Asked in 2071-II

External CSS contains separate CSS file which contains only style property with the help of tag attributes (For example class, id, heading, … etc). CSS property written in a separate file with .css extension and should be linked to the HTML document using link tag. This means that for each element, style can be set only once and that will be applied across web pages.

E.g. 

<!DOCTYPE html> 

<html> 

    <head> 

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

    </head> 

    <body> 

        <div class = "main"> 

            <div class ="CN">College Note</div> 

            <div id ="webtech"> 

                Web tech solution. 

            </div> 

        </div> 

    </body> 

</html> 


//style.css

body {

    background-color:powderblue;

}

.main {

    text-align:center;   

}

.CN {

    color:#009900;

    font-size:50px;

    font-weight:bold;

}

#webtech {

    font-style:bold;

    font-size:20px;

}