Question

XML

1) Create an XML schema for a catalog of cars, where each car has the child elements make, model, year, color, engine, number_of_doors, transmission_type, and accessories. The engine element has the child elements number_of_cylinders and fuel_system (carbureted or fuel injected). The accessories element has the attributes radio, air_conditioning, power_windows, power_steering, and power_brakes, each of which is required and has the possible values yes and no.

2) Create an XML document with at least three instances of the car element defined in the XML schema of previous exercise. Process this document by using the previous XML schema, and produce a display of the raw XML document. Create a CSS style sheet for the XML document and use it to override the default styles of the XML document.

Answer 1

1.

cars.xsd:

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

<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema">

<xs:element name="Cars">

<xs:complexType>

<xs:sequence>

<xs:element name="make" type="xs:string"/>

<xs:element name="model" type="xs:string"/>

<xs:element name="year" type="xs:string"/>

<xs:element name="color" type="xs:string"/>

<xs:element name="engine">

<xs:complexType>

<xs:sequence>

<xs:element name="number_of_cylinders" type="xs:string"/>

<xs:element name="fuel_system" type="xs:string"/>

</xs:sequence>

</xs:complexType>

</xs:element>

<xs:element name="number_of_doors" type="xs:string"/>

<xs:element name="transmission_type" type="xs:string"/>

<xs:element name="accessories">

<xs:complexType>

<xs:sequence>

<xs:element name="radio" type="xs:string"/>

<xs:element name="air_conditioning" type="xs:string"/>

<xs:element name="power_windows" type="xs:string"/>

<xs:element name="power_steering" type="xs:string"/>

<xs:element name="power_brakes" type="xs:string"/>

</xs:sequence>

</xs:complexType>

</xs:element>

</xs:sequence>

</xs:complexType>

</xs:element>

</xs:schema>

2.

cars.xml

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

<!-- Link to css file -->

<?xml-stylesheet type = "text/css" href = "cars.css" ?>

<!--CREATE A CATALOG ROOT TAG-->

<catalog

    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

    xsi:noNamespaceSchemaLocation="cars.xsd">

<h1>CARS CATALOG</h1>

<car>

<make> <h4> Make: </h4> Buggati </make>

<model> <h4> Model: </h4> Veyron </model>

<year> <h4> Year: </h4> 2016 </year>

<color> <h4> Color: </h4> Gray </color>

<engine>

    <cylinders> <h4> Cylinders: </h4> 16 </cylinders>

    <fuel_system> <h4> Fuel System: </h4> Fuel Injected </fuel_system>

</engine>

<number_of_doors> <h4> Doors: </h4> 2 </number_of_doors>

<transmission_type> <h4> Transmission: </h4> Automatic </transmission_type>

<accessories>

    <radio> <h4> Radio: </h4> Yes </radio>

    <air_conditioning> <h4> Air Conditioning: </h4> Yes </air_conditioning>

    <power_windows> <h4> Power Windows: </h4> Yes </power_windows>

    <power_steering> <h4> Power Steering: </h4> Yes </power_steering>

    <power_brakes> <h4> Power Brakes: </h4> Yes </power_brakes>

</accessories>

</car>

<car>

<make> <h4> Make: </h4> Lamborghini </make>

<model> <h4> Model: </h4> Aventador </model>

<year> <h4> Year: </h4> 2016 </year>

<color> <h4> Color: </h4> Orange </color>

<engine>

    <cylinders> <h4> Cylinders: </h4> 12 </cylinders>

    <fuel_system> <h4> Fuel System: </h4> Fuel Injected </fuel_system>

</engine>

<number_of_doors> <h4> Doors: </h4> 2 </number_of_doors>

<transmission_type> <h4> Transmission: </h4> Automatic </transmission_type>

<accessories>

    <radio> <h4> Radio: </h4> Yes </radio>

    <air_conditioning> <h4> Air Conditioning: </h4> Yes </air_conditioning>

    <power_windows> <h4> Power Windows: </h4> Yes </power_windows>

    <power_steering> <h4> Power Steering: </h4> Yes </power_steering>

    <power_brakes> <h4> Power Brakes: </h4> Yes </power_brakes>

</accessories>

</car>

<car>

<make> <h4> Make: </h4> Jaguar </make>

<model> <h4> Model: </h4> XJ </model>

<year> <h4> Year: </h4> 2016 </year>

<color> <h4> Color: </h4> Black </color>

<engine>

    <cylinders> <h4> Cylinders: </h4> 6 </cylinders>

    <fuel_system> <h4> Fuel System: </h4> Fuel Injected </fuel_system>

</engine>

<number_of_doors> <h4> Doors: </h4> 2 </number_of_doors>

<transmission_type> <h4> Transmission: </h4> Automatic </transmission_type>

<accessories>

    <radio> <h4> Radio: </h4> Yes </radio>

    <air_conditioning> <h4> Air Conditioning: </h4> Yes </air_conditioning>

    <power_windows> <h4> Power Windows: </h4> Yes </power_windows>

    <power_steering> <h4> Power Steering: </h4> Yes </power_steering>

    <power_brakes> <h4> Power Brakes: </h4> Yes </power_brakes>

</accessories>

</car>

</catalog>

cars.css

catalog {

     background-color: black;

}

h1 {

     text-align: center;

     color: red;

     margin-top: 30px;

     display: block;

     text-transform: uppercase;

     font-weight: 900;

     font-family: monospace;

     font-size: 38px;

}

car {

      padding: 15px;

      width: 250px;

      margin-left: auto;

      margin-right: auto;

      margin-top: 15px;

      margin-bottom: 15px;

      background-color: gray;

      border-radius: 25px;

      display: block;

}

h4 {

     font-weight: 900;

     font-family: monospace;

}

make, model, year, color, cylinders, fuel_system, number_of_doors, transmission_type {

     display: block;

     font-family: monospace;

     font-size: 12pt;

}

radio, air_conditioning, power_windows, power_steering, power_brakes {

     display: block;

     font-family: monospace;

     font-size: 12pt;

}