Necesito que alguien me pruebe el siguiente codigo, Utilicen cualquier imagen que se les antoje.
index.html
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>AMS. Tecnologia a tu Servicio</title>
<!--<script type="text/javascript" language="javascript" src="codigo.js"></script> -->
<!--<link href="Menus.css" rel="stylesheet" type="text/css">-->
</head>
<script type="text/javascript" language="javascript" src="script09.js"></script>
<style type="text/css">
body
{
background:#FFFFFF;
width:100%
height:100%;
margin:0;
/*background: url(gradAzulGreen.jpg) repeat-y scroll 0;*/
}
#degradado
{
height: 100%
width: 100%;
min-height:900px;
background: url(gradienteAzul.jpg) repeat-y scroll 0;
margin:1;
}
#content
{
max-height:600px;
max-width:750px;
height:480px;
background: url(EsTxt.jpg) no-repeat;
margin:1;
display:block;
text-decoration: none;
font-weight: bold;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
/* Root = Horizontal, Secondary = Vertical */
ul#menu
{
margin: 0;
border: 0 none;
padding: 0;
/* ahora esta en 737px width: 500px; For KHTML with 360px*/
width:710px;
list-style: none;
height: 20px;
/*border:1px solid #55E;/* Original #eee*/
padding-top:25px;
padding-right:8px;
padding-left:31px;
padding-bottom:1px;
}
ul#menu li
{
margin: 0;
border: 0 none;
padding: 0;
float: left; /*For Gecko*/
display: inline;
list-style: none;
position: relative;
height: 20px;
}
ul#menu li
{
padding-right:10px;
padding-left:16px;
padding-bottom:5px;
}
ul#menu li:hover
{
/*background:#FFF;/* Original #eee */
}
ul#menu ul
{
margin: 0;
border: 0 none;
padding: 0;
width: 60px;
list-style: none;
display: none;
position: absolute;
top: 25px;
left: 10px;
/*background: #EEE;/* Original #eee */
border: none;
opacity: 0.8;
-moz-opacity: 0.8;
filter:alpha(opacity=80);
}
ul#menu ul:after /*From IE 7 lack of compliance*/
{
clear: both;
display: block;
font: 1px/0px serif;
content: ".";
height: 0;
visibility: hidden;
}
ul#menu ul li
{
width: 40px;
float: left; /*For IE 7 lack of compliance*/
display: block !important;
display: inline; /*For IE*/
}
/* Root Menu */
ul#menu input
{
padding: 2px 4px 2px;
float: none !important; /*For Opera*/
float: left; /*For IE*/
display: block;
background:transparent;/*Verde: #99FF99 Azul: #00AAFF*/
color: transparent;/* original #9FCF21 */
text-decoration: none;
font-weight: bold;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
/*border-right:1px solid #818181;*/
text-decoration: none;
height: auto !important;
height: 1%; /*For IE*/
border:none;
opacity: 0.8;
-moz-opacity: 0.8;
}
/* Root Menu Hover Persistence */
ul#menu input:hover,ul#menu li:hover input,ul#menu li.iehover input
{
/*color: #000000;/*Original #003300*/
}
/* 2nd Menu */
ul#menu li:hover li input a, ul#menu li.iehover li input a
{
float: none;
border:none;
}
/* 2nd Menu Hover Persistence */
ul#menu li:hover li a:hover input:hover, ul#menu li:hover li:hover input, ul#menu li.iehover li a:hover, ul#menu li.iehover li.iehover input
{
background:#55A;/* Original #ddd */
color: #000000;/* Original #003300 */
}
/* 3rd Menu */
ul#menu li:hover li:hover li input, ul#menu li.iehover li.iehover li input
{
background: #55A;/* Original #EEE */
color: #000000;/* Original #666 */
}
/* 3rd Menu Hover Persistence */
ul#menu li:hover li:hover li a:hover input:hover, ul#menu li:hover li:hover li:hover input, ul#menu li.iehover li.iehover li a:hover,ul#menu li.iehover li.iehover li.iehover input a
{
background:#55A;/* Original #ddd */
color: #000000; /* Original #FFF */
}
/* 4th Menu */
ul#menu li:hover li:hover li:hover li input, ul#menu li.iehover li.iehover li.iehover li input a
{
background:#55A;/* Original #ddd */
color: #000000; /* Original #ddd */
}
/* 4th Menu Hover */
ul#menu li:hover li:hover li:hover li input:hover, ul#menu li.iehover li.iehover li.iehover li a:hover
{
background: #55A;/* Original #CCC */
color: #000000; /* Original #FFF */
}
ul#menu ul ul, ul#menu ul ul ul
{
display: none;
position: absolute;
top: 0;
left: 160px;
}
/* Do Not Move - Must Come Before display:block for Gecko */
ul#menu li:hover ul ul, ul#menu li:hover ul ul ul, ul#menu li.iehover ul ul, ul#menu li.iehover ul ul ul
{
display: none;
}
ul#menu li:hover ul, ul#menu ul li:hover ul, ul#menu ul ul li:hover ul, ul#menu li.iehover ul, ul#menu ul li.iehover ul, ul#menu ul ul li.iehover ul
{
display: block;
}
ul#menu .selected
{
color: #000000;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<center>
<div id="degradado" name="degradado">
<table>
<tr>
<td colspan="2" align="center">
<div id="cabecera"><a href="index.html" value="Logo"><img src="cabezera.jpg"></a></div>
<form action="#">
<div id="menu" name="menu" >
<ul id="menu" name="menu" style="position:relative; z-index:10px;background: url(Menu.png) no-repeat;height:160PX" align="center">
<li align="Center"><input type="button" id="Nosotros" name="Nosotros" value="Nosotros" style="padding-top:1px;padding-right:1px;padding-left:1px;padding-bottom:1px;">
<ul>
<li><input type="button" id="Mision" name="Mision" value="Mision" style="color: #000000;" ></li>
<li><input type="button" id="Vision" name="Vision" value="Vision" style="color: #000000;"></li>
<li><input type="button" id="Valores" name="Valores" value="Valores" style="color: #000000;"></li>
</ul>
</li>
<li><input type="button" id="Proyectos" value="Proyectos" style="padding-top:1px;padding-right:2px;padding-left:1px;padding-bottom:1px;">
<ul>
<li><input type="button" id="Ohm" value="OHM" style="color: #000000;"></li>
<li><input type="button" id="Banio" value="Baño" style="color: #000000;"></li>
<li><input type="button" id="Taxco" value="ONGs" style="color: #000000;"></li>
<li><input type="button" id="Otro" value="Proyecto" style="color: #000000;"></li>
</ul>
</li>
<li><input type="button" id="Servicios" value="Servicios" style="padding-top:1px;padding-right:6px;padding-left:1px;padding-bottom:1px;">
<ul>
<li><input type="button" id="DomoticaS" value="Domotica" style="color: #000000;"></li>
<li><input type="button" id="DisenioS" value="Diseño" style="color: #000000;"></li>
<li><input type="button" id="ComputoS" value="TI" style="color: #000000;"></li>
<li><input type="button" id="EventosS" value="Eventos" style="color: #000000;"></li>
<li><input type="button" id="IngenieriaS" value="Ingenieria" style="color: #000000;"></li>
<li><input type="button" id="SustentabilidadS" value="Sustentabilidad" style="color: #000000;"></li>
</ul>
</li>
<li><input type="button" id="Productos" value="Productos" style="padding-top:1px;padding-right:1px;padding-left:1px;padding-bottom:1px;">
<ul>
<li><input type="button" id="DomoticaP" value="Domotica" style="color: #000000;"></li>
<li><input type="button" id="DisenioP" value="Diseño" style="color: #000000;"></li>
<li><input type="button" id="ComputoP" value="TI" style="color: #000000;"></li>
<li><input type="button" id="EventosP" value="Eventos" style="color: #000000;"></li>
<li><input type="button" id="IngenieriaP" value="Ingenieria" style="color: #000000;"></li>
<li><input type="button" id="SustentabilidadP" value="Sustentabilidad" style="color: #000000;"></li>
</ul>
</li>
<li><input type="button" id="Casos" value="Casos" style="padding-top:5px;padding-right:25px;padding-left:1px;padding-bottom:5px;">
<ul>
<li><input type="button" value="Ohm Cafe" style="color: #000000;"></li>
<li><input type="button" value="Aqui" style="color: #000000;"></li>
<li><input type="button" value="Alla" style="color: #000000;"></li>
<li><input type="button" value="Aquel" style="color: #000000;"></li>
</ul>
</li>
<li><input type="button" value="Noticias" style="padding-top:1px;padding-right:15px;padding-left:1px;padding-bottom:1px;"></li>
<li><input type="button" value="Participa" style="padding-top:1px;padding-right:15px;padding-left:1px;padding-bottom:1px;"></li>
</ul>
</div>
</form>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<div id="content" name="content" align="Justify"></div>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<a href="https://twitter.com/#!/AMSSistemas1"><img src="iconoT.jpg" alt="twit"></a>
<a href="https://www.facebook.com/pages/AMS/111501162307164?ref=ts"><img src="iconoF.jpg" alt="FB"></a>
<a href="https://www.blogger.com/home"><img src="iconoB.jpg" alt="Bing"></a>
<a href="https://amsservicios.wordpress.com"><img src="iconoW.jpg" alt="WP"></a>
</td>
</tr>
</table>
</div>
</center>
</body>
</html>