Scribd
Upload
7 views7 pages

XML and CSS for Tutorial Styling

The document outlines an XML program designed to display student details across various tutorial sections, styled with CSS. It includes an algorithm for creating separate XML and CSS files, linking them, and defining styles for the displayed information. The XML structure contains sections for different topics such as Algorithms, Data Structures, Web Technology, Languages, and DBMS, each with specific topics listed under them.

Uploaded by

dharunabc33
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
7 views7 pages

XML and CSS for Tutorial Styling

The document outlines an XML program designed to display student details across various tutorial sections, styled with CSS. It includes an algorithm for creating separate XML and CSS files, linking them, and defining styles for the displayed information. The XML structure contains sections for different topics such as Algorithms, Data Structures, Web Technology, Languages, and DBMS, each with specific topics listed under them.

Uploaded by

dharunabc33
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

XML Program to display the information about various sections in

Tutorial and the topics styling with CSS. Date :

Aim: To write an XML program to display the information about various sections in tutorial and

the topics styling with CSS.

Tools Required: Notepad Editor and Web Browser like Internet Explorer, Google Chrome or

Mozilla Firefox.

Algorithm:

1. xml file(.xml) and css(.css) file is created separately to store data and design.

2. In xml file the details of the student details with various topics is created using our own

tag.

3. In css file the design and styles for each details are declared.

4. The css file is linked with the xml file by using href=”[Link]” and finally the xml data is

designed with cascading styles.

Program:

[Link]

<?xml version="1.0" encoding="UTF-8"?>


<?xml-stylesheet type="text/css" href="[Link]"?>

<Tutorials>

<title>student details</title>

<tutorial_section>

<name>Algo</name>

<topic1>Greedy Algo</topic1>

<topic2>Randomised Algo</topic2>

<topic3>Searching Algo</topic3>

<topic4>Sorting Algo</topic4>

</tutorial_section>

<tutorial_section>

<name>Data Structures</name>

<topic1>Array</topic1>

<topic2>Stack</topic2>

<topic3>Queue</topic3>

<topic4>Linked List</topic4>
</tutorial_section>

<tutorial_section>

<name>Web Technology</name>

<topic1>HTML</topic1>

<topic2>CSS</topic2>

<topic3>Java Script</topic3>

<topic4>Php</topic4>

</tutorial_section>

<tutorial_section>

<name>Languages</name>

<topic1>C/C++</topic1>

<topic2>Java</topic2>

<topic3>Python</topic3>

<topic4>Ruby</topic4>

</tutorial_section>

<tutorial_section>
<name>DBMS</name>

<topic1>Basics</topic1>

<topic2>ER Diagram</topic2>

<topic3>Normalization</topic3>

<topic4>Transaction Concepts</topic4>

</tutorial_section>

</Tutorials>

[Link]

Tutorials:

font-size:80%;

margin:0.5em;

font-family: Verdana;

display:block;

tutorial_section {
display:block;

border: 1px solid silver;

margin:0.5em;

padding:0.5em;

background-color:whitesmoke;

title {

display:block;

font-weight:bolder;

text-align:center;

font-size:30px;

background-color: green;

color: white;

name, topic1, topic2, topic3, topic4 {

display:b
text-align:center;

name {

color:green;

text-decoration: underline ;

font-weight:bolder;

font-size:20px;

topic1 {

color:green

topic2 {

color:brown

topic3 {

color:blue
}

topic4 {

color:orange

You might also like