Follow along with the video below to see how to install our site as a web app on your home screen.
Note: This feature may not be available in some browsers.
<url>[URL unfurl="true"]http://www.xyx.com/slideshow.html</url>[/URL]
<linktext>Slide Show</linktext>
[code]
and use XSL to convert it to the HTML version.
<leftSidebar>
<menu>
<ul>
<li><a href="assignment_slideshow.html">Main Menu</a></li>
<li><a href="assignment_slideshow.html">Slide Show</a></li>
<li><a href="assignment_slideshow.html">Calculator</a></li>
<li><a href="assignment_slideshow.html">Top DVD's</a></li>
<li><a href="assignment_slideshow.html">Contact Form</a></li>
<li><a href="assignment_slideshow.html">My Report</a></li>
</ul>
</menu>
</leftSidebar>
<?xml version="1.0" encoding="iso-8859-1"?>
<?xml-stylesheet type="text/css" href="xml.css"?>
<wrapper>
<header>
</header>
<header1>
</header1>
<header2>
</header2>
<leftSidebar>
<menu>
<ul>
<li><a href="assignment_slideshow.html">Main Menu</a></li>
<li><a href="assignment_slideshow.html">Slide Show</a></li>
<li><a href="assignment_slideshow.html">Calculator</a></li>
<li><a href="assignment_slideshow.html">Top DVD's</a></li>
<li><a href="assignment_slideshow.html">Contact Form</a></li>
<li><a href="assignment_slideshow.html">My Report</a></li>
</ul>
</menu>
</leftSidebar>
<rightSidebar>
</rightSidebar>
<content>
<dvd-menu>
<dvd>
<name>Final Fantasy VII: Advent Children (2 Discs)</name>
<price>£4.99</price>
<description>The much anticipated sequel to the top selling game Final Fantasy VII.</description>
<rating>Rating: 8/10</rating>
</dvd>
<dvd>
<name>Ghost In The Shell (Special Edition)</name>
<price>£6.99</price>
<description>A female cyborg cop and her partner hunt a mysterious and powerful hacker called the Puppet Master.</description>
<rating>Rating: 9/10</rating>
</dvd>
<dvd>
<name>Cowboy Bebop: The Movie</name>
<price>£4.99</price>
<description>Based on the widely popular TV series 'Cowboy Bebop'. A terrorist explosion releases a deadly virus on the masses, and it's up the bounty-hunting Bebop crew to catch the cold-blooded culprit.</description>
<rating>Rating: 7/10</rating>
</dvd>
<dvd>
<name>French Toast</name>
<price>£4.50</price>
<description>Thick slices made from our homemade
sourdough bread.</description>
<rating>600</rating>
</dvd>
<dvd>
<name>Homestyle Breakfast</name>
<price>£6.95</price>
<description>Two eggs, bacon or sausage, toast,
and our ever-popular hash browns.</description>
<rating>950</rating>
</dvd>
</dvd-menu>
</content>
</wrapper>
/* CSS Document */
positioning#body{
text-align:center
}
wrapper {
height:980px;
width:1247px;
margin:0 auto;
text-align:left;
position:relative;
background-color:#000000
}
header {
background-color:#151515;
position:absolute;
top:0;
left:0;
height:306px;
width:1247px;
color:#FFFFFF;
background-image:url(images/header5.gif);
background-position:left;
background-repeat:no-repeat;
border-bottom:thick;
border-bottom-color:#990000;
border-bottom-style:ridge
}
header1 {
position:absolute;
left:850px;
top:50px;
font-size:36px
}
header2 {
position:absolute;
left:970px;
top:100px;
font-size:36px
}
content {
background-color:#000000;
width:767px;
height:500px;
position:absolute;
top:370px;
left:240px;
background-image:url(images/background_black.jpg);
}
dvd-menu
{
background-color: #000000;
width: 100%;
}
dvd
{
display: block;
margin-bottom: 15pt;
margin-left: 60px
}
name
{
color: #990000;
font-size: 20pt;
}
price
{
color: #6699FF;
font-size: 20pt;
}
description,rating
{
display: block;
color: #CCCCCC;
margin-left: 20pt;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
}
leftSidebar {
background-color:#990000;
width:220px;
height:552px;
position:absolute;
top:370px;
left:0;
background-image:url(images/right.jpg);
background-position:top left;
background-repeat:no-repeat
}
rightSidebar{
background-color:#990000;
width:220px;
height:552px;
position:absolute;
top:370px;
left:1027px;
background-image:url(images/left.jpg);
background-position:top left;
background-repeat:no-repeat
}
menu ul {
margin: 45px 0 0 0;
padding: 0;
list-style-type: none;
}
menu li {
margin: 0 0 10px 20px;
}
menu a {
display:block;
color: #000;
background-color: #CC6600;
width: 9em;
padding: .2em .8em;
text-decoration: none;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
}
menu a:hover {
background-color: #369;
color: #FFF;
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
}
active a {
display: block;
color: #FFF;
background-color: #BD0F0F;
width: 9em;
padding: .2em .8em;
text-decoration: none;
}
active a:hover {
color: #FFF;
background-color: #E04949;
width: 9em;
padding: .2em .8em;
text-decoration: none;
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
}